代码说明：

Question

在这个jquery脚本中卡住了一点。我希望在勾选复选框时获取link中最后td的{{1}}属性。这是HTML

tr

我希望在多个复选框的时候获取最后一个td中的每个链接属性我试过的是这个

      <tr>
          <td><input type="checkbox" name="check" value="happy"></td>
          <td style="width: 310px; line-height: 14px;" class="fileName <?php echo $myClass; ?>" ><div style="width: 310px; overflow: hidden;"><a href="https://abcd.com/<?php echo $info."/".$myinfo['name'];?>" title="<?php echo $myinfo['name'];?>" target="_blank"><?php echo $fileName.'.'.$fileExtension; ?></a></div></td>
           <td style="width: 150px;"><?php echo $fileSize; ?> KB</td>
           <td style="width: 150px;"><?php echo $fileModified; ?></td>
           <td style="width: 150px;">
               <a href="javascript:void(0);" ><span id="" link="https://abcd.com/<?php echo $info."/".$myinfo['name'];?>" title="<?php echo $myinfo['name'];?>" class="shareIcon"></span></a>
               <a href="javascript:void(0);"><span id="deleteIcon" link="<?php echo $myBucket['name'];?>" class="deleteIcon"></span></a>
           </td>
         </tr>

Answer 1

有几个错误：
1）验证您的html，input标记的不正确关闭。这导致以下

checked.parent()  //points the body not its actual td

2）转义/个字符的正确方法。

link="https://abcd.com/<?php echo $info."/".$myinfo['name'];?>"  //WRONG

3）以下代码仅指向td的{{1}}父代，因此失败

input

最后，没有必要迭代以获得可以使用checked.parents('td').find('.shareIcon').attr('link')的最后td

:last

Updated JSFiddle

Answer 2

试试这个脚本：

 $("input[name='check']").on('change', function () {
     var checked = $("input[name='check']:checked");
     $.each(checked, function () {
         if (checked.length >= 1) {
             $.each(checked.parent().siblings().last().children().children(), function() {
                 console.log($(this).data("link"));
             });
         }
     })
 });

这个HTML：

<table>
    <tr>
        <td>
            <input type="checkbox" name="check" value="happy">
        </td>
        <td style="width: 310px; line-height: 14px;" class="fileName <?php echo $myClass; ?>">
            <div style="width: 310px; overflow: hidden;"><a href="https://abcd.com/areeb" title="areeb" target="_blank">some_file.php</a>

            </div>
        </td>
        <td style="width: 150px;">212KB</td>
        <td style="width: 150px;">some_file.php</td>
        <td style="width: 150px;"> <a href="javascript:void(0);"><span id="" data-link="https://abcd.com/areeb" title="<?php echo $myinfo['name'];?>" class="shareIcon"></span></a>
 <a href="javascript:void(0);"><span id="deleteIcon" data-link="<?php echo $myBucket['name'];?>" class="deleteIcon"></span></a>

        </td>
    </tr>
</table>

Fiddle

代码说明：

JavaScript代码：

我刚刚改变你的条件，以便它甚至可以匹配一个元素。然后$.each()函数也会稍微改变一下。我首先定位你的复选框的父级td，然后我得到所有的兄弟姐妹，然后我选择最后一个兄弟，然后我进入它的a的儿童或锚标签然后我弹出进入那些a s的子项以及span s，然后对于每个范围我记录它的data-link属性。

HTML代码：

我刚刚将link属性的名称更改为data-link属性，以便通过data功能轻松访问。

Answer 3

var inputs = $('input[name="check"]').on('change', function () {
    inputs.each(function () {
        var i = $(this);

        if (i.is(':checked')) {
            console.log(i.closest('tr').find('.shareIcon').attr('link'));
        }
    });
});

fiddle

使用jquery从表的最后一个tr获取属性

3 个答案:

Updated JSFiddle

代码说明：

JavaScript代码：

HTML代码：