Question

我有这个HTML：

<div id="list1">info needed for jquery script</div>
<tr>
<td><button class="button green">Click Me</button></td>
<td></td>
<td></td>
</tr>
<div id="list2">info needed for jquery script</div>
<tr>
<td><button class="button green">Click Me</button></td>
<td></td>
<td></td>
</tr>

如果有人点击了我点击按钮，我如何根据他们点击的按钮获取tr之前的div？因此，如果他们点击第一次点击我就会获得list1的值，如果他们点击第二个Click Me按钮，它将获得名为list2的div中的内容。 div的id是动态创建的，因此它可以是list25或list100。但它始终以单词列表开头，后跟数值。

Answer 1

忽略表格内的无效div;

$("button").click(function() {
    var value = $(this).parents("tr").prev("div").text();
});

Answer 2

好吧，我认为你应该将你的标签和你的按钮嵌入另一个div中，就像

一样

    <div id='parent_node'>
     <div id="list2">info needed for jquery script</div>
     <tr>
     <td><button class="button green">Click Me</button></td>
     <td></td>
     <td></td>
     </tr>
    </div>

当'click'事件被触发时，'this'变量将成为触发事件的对象，因此您可以使用this.parent（）或this.siblings（）在父节点内遍历以查找任何值你想要的，比如：

   $(".button_green").click(function(){
    alert($(this).siblings()[0].innerHTML);
})

Answer 3

我是这样做的：

$("button.button.green").click(
    function (event) {
        var button = $(this);

        console.log(button.prev("div").text());
    });

它可能无法正常工作，因为您的HTML格式不正确（您的表元素没有表格）。但是，正如你从这个jsFiddle中看到的那样，它可以工作：

http://jsfiddle.net/JohnMunsch/VX3DR/

一旦你完成了你的HTML，你就会想要调整你调用的遍历函数来获取你感兴趣的元素。上面我使用了.prev（）但是jQuery有很多这样的函数，请看这里可用的选择：

http://api.jquery.com/category/traversing/

它们允许您从您拥有的元素开始，遍历DOM并找到另一个元素。

Jquery - 单击另一个按钮时在动态创建的div中查找值

3 个答案: