jquery删除表行

Ell*_*ott 1 javascript jquery animation

我在删除表格行时遇到问题,我可以突出显示红色行,但是当我尝试删除它时,幻灯片功能会混乱.我已将它们包裹在一个div中,但我不知道如何访问tr的孩子,然后是那个孩子?

$('#test tr:not(:first)').click(function()
        {           
            $(this).css("background-color","red");  

            $(this).children("td div").slideUp(function()
            {    
                $(this).parent().remove(); 
            });              
        });
Run Code Online (Sandbox Code Playgroud)

问题是这一行:

$(this).children("td div").slideUp(function()
Run Code Online (Sandbox Code Playgroud)

我也试过了

$(this).children("td").children("div").slideUp(function()
Run Code Online (Sandbox Code Playgroud)

向上滑动仅删除第一列.

<table border="1" width="600" cellspacing="0" cellpadding="0" id="test">
    <tr>
        <td><b>First Name</b></td>
        <td><b>Last Name</b></td>
        <td><b>Address</b></td>
        <td><b>Town</b></td>

    </tr>

    <tr>
        <td><div>First Name</td>
        <td>Last Name</td>
        <td>Address</td>
        <td>Town</div></td>

    </tr>

</table>
Run Code Online (Sandbox Code Playgroud)

我是否需要<td>div标签包装每个内容?

谢谢

SLa*_*aks 5

通话children("td div")将找到与选择器匹配的所有直接孩子.(所有的孩子都是<div>s里面的 孩子<td>)
因为所有的直接孩子都是<td>s,所以不会匹配任何东西.

呼叫children("td").children("div")会发现所有<div>里面装的是<td>秒.
因此,它将找到<div>你唯一拥有的东西.

编辑:您可以使用jQuery创建包装元素; 看我的博文:

$('#test tr:not(:first)').click(function() {           
    $(this).css("background-color","red");  

    $(this).children().wrapInner('<div>').children().slideUp(function() {    
        $(this).closest('tr').remove();
    });
});
Run Code Online (Sandbox Code Playgroud)

演示