Question

我遇到slideUp的问题。只有一个元素（第一个）向上滑动。请帮帮忙。谢谢。以下是代码：

$(document).ready(function() {
    $('#load').hide();
});
$(function() {
    $("#del").click(function() {
        $('#load').fadeIn();
        $(this).parent().slideUp('slow', function() {$(this).remove();});
        $('#load').fadeOut();
    });
});

这是标记：

<div id="container">
    <table>
        <div id="load" align="center"><img src="images/loading.gif" width="28" height="28"     align="absmiddle"/> loading...</div>
        <tr><td>    
            <span>Ashley Ford</span><br/></td>  
            <td><a href="#" id="del">x</a>  
        </td></tr>
        <tr><td>
            <span>Ashley Ford</span><br/></td>
            <td><a href="#" id="del">x</a>
        </td></tr>
        <tr><td>
            <span>Ashley Ford</span><br/></td>
            <td><a href="#" id="del">x</a>
        </td></tr>  
    </table>
</div>

Answer 1

来自ID selector的jQuery文档（强调添加）：

如果为多个元素分配了相同的ID，则查询该ID 使用该ID只会选择DOM中的第一个匹配的元素。

您可以将#del元素更改为使用类名（或其他一些共同特征）：

<a href="#" class="del">x</a>

并相应地修改您的选择器：

$(".del").click(function() {
    //Do stuff
});

作为旁注，您有两个将在DOM准备就绪的函数。您可以将它们合二为一。只需将$('#load').hide();移动到另一个DOM就绪事件处理程序中。

将div作为table元素的子项时，HTML无效。

Answer 2

对于多个元素，您不能拥有相同的id ..因为您必须使用class 1.将您的id="del"更改为class="del" 2.试试这个功能

 $(function() {
      $(".del").click(function() {
      $('#load').fadeIn();
      $(this).parent().slideUp('slow', function() {$(this).remove();});
    $('#load').fadeOut();

    });
     });

Answer 3

正如其他人所说，每个元素id都应该是唯一的。如果您需要对一组元素进行分组，那就是元素class的用途。

jQuery slideUp仅适用于第一个元素

3 个答案: