jQuery $(this).closest show&隐藏

时间:2013-08-02 19:51:40

标签: jquery

我有一个包含多行的表格。每行中都有“显示详细信息”按钮和“隐藏详细信息”按钮。在单击显示详细信息时,我希望隐藏详细信息按钮仅显示特定行。我认为.closest()函数可以工作,但还没有。

这是HTML

<table>
    <tr id="1">
      <td><button class='view'>View Details</button><button class='hide' style='display:none;'>Hide Details</button></td>
    </tr>

    <tr id="2">
      <td><button class='view'>View Details</button><button class='hide' style='display:none;'>Hide Details</button></td>
    </tr>
</table>

这是jQuery

$(".view").click(function() {   
    $("#patient").show("");
    $(this).hide();
    $(this).closest(".hide").show();
});

3 个答案:

答案 0 :(得分:9)

.closest仅查看当前元素及其父元素。你必须这样做:

$(this).parent().find('.hide');

$(this).siblings('.hide');

答案 1 :(得分:2)

尝试next()而不是nearest()。

http://api.jquery.com/next/ http://api.jquery.com/siblings/

当使用最接近的时候,你通常会给它一些额外的信息,比如要查找的类或其他东西。

答案 2 :(得分:2)

dom准备好后你有约束力吗?试试这个:

$(function(){
    $(".view").click(function() {   
        $("#patient").show("");
        $(this).hide().next().show();
    });
});