Question

我有这样的DOM：

<div class="parent">
   <button class="add-tr">Add</button>
   <table class="child">
   <tr data="0"></tr>
   <tr data="1"></tr>
   ...
   </table>
</div>
<div class="parent">
   <button class="add-tr">Add</button>
   <table class="child">
   <tr data="0"></tr>
   <tr data="1"></tr>
   ...
   </table>
</div>
...

当我点击Add按钮时，我想从它自己的父类的最后一个获取data属性的值。

我使用此方法获取最后一个元素，但它不起作用。

$('.add-tr').click( function() {
   var last = $(this).parent().find('.child:last').attr('data');
   alert(last);
})

知道为什么吗？或者任何其他建议来获取表格中的最后一个元素？

更新是的，我发现了问题，结果是我忘记了＆＃39; tr＆＃39;。谢谢你们的回答。你们所有人都给出了正确的答案，我希望我能接受你们的所有答案。谢谢

Answer 1

试试这个

   var last = $(this).parent().find('.child').find('tr').last().attr('data');

在您的示例中，您获得了上次table，但您需要获得最后tr

Example

Answer 2

$(".parent").click(function(){

$(this + " tr:last-child").attr("data");

});

应该这样做。

Answer 3

'.child:last'选择器将选择具有child类的最后一个元素。当child类应用于<table>时，此选择器将选择表格元素，而您想要选择上一个<tr>。

由于data上没有<table>属性，.attr('data')上的undefined将返回data。

要在上一个<tr>获取tr:last属性的值，请使用选择器var value = $(this) // Button that is clicked .parent() // Direct parent element i.e. div.parent .find('.child tr:last') // Get the last <tr> inside .child .attr('data'); // Get value of data attribute。

.child

由于next()元素位于按钮旁边，table.child可用于获取var value = $(this) // Button that is clicked .next('.child') // Next element i.e. table .find('tr:last') // Get last <tr> .attr('data'); // Get value of "data" attribute元素。

data-*

我建议使用<tr data-num="0">Foo</tr> <tr data-num="1">Bar</tr>属性在自定义属性中存储数据。

data()

要获取自定义数据属性的值，请使用.data('num')

tr

如果您只想获取最后一个index()的索引，则无需将其存储在元素上。您可以使用.index()。

获取索引

z-index: -1;

这将返回元素的索引。请注意，这是从零开始的索引，这正是您想要的。

Answer 4

$('.add-tr').click( function(event) {
   var last = $(event.target).next().find("tr").last().attr("data");
   alert(last);
})

fiddle-example

Answer 5

您可以使用tr获取find('.child tr')元素的数组要获取该数组中的最后一个元素，您可以使用last()。总而言之，你有这个：

$('.add-tr').click( function() {
   var lastTr = $(this).parent().find('.child tr').last(),
       lastData = $(lastTr).attr('data');

   alert(lastData);
});

我已在此处设置了一个codepen http://codepen.io/anon/pen/aOzmKg以显示此工作。

Answer 6

您的代码几乎是正确的，您错过了tr:last，即：

var last = $(this).parent().find('.child tr:last').attr('data');

样本

http://jsfiddle.net/tuga/vr1knxqq/3/

如何通过jquery获取.find（）对象中的最后一个元素

6 个答案: