Question

我需要选择行 tr 属性（类）并进行更改。当我想从单元格中选择 tr 顶部时，我迷失了方法：

HTML：

<table>
    <tr class="a">
        <td>name</td>
        <td>text</td>
        <td>text22222</td>
        <td><input type="checkbox" class="inpu" /></td>
    </tr>
    <tr class="a">
        <td>name</td>
        <td>text</td>
        <td>text2</td>
        <td><input type="checkbox" class="inpu" /></td>
    </tr>
</table>

jQuery的：

$('.inpu').click(function()
{
     alert( $(this).parent().parent().closest('tr')[0].html() );                         
});

Link to jsfiddle sample

Answer 1

您使用closest()直接过分复杂化

var tr = $(this).closest('tr');

您当前的问题$(this).parent().parent()指的是tr且它没有tr作为父元素，因此您的代码无效。

$(this) //Element
.parent() //TD
.parent() //TR

Answer 2

您可以直接在closest()引用上使用this来获取特定类型的最近父元素，然后调用addClass来修改class属性：

$('.inpu').click(function() {
    $(this).closest('tr').addClass('foo');
});

Answer 3

$('.inpuy').click(function(){
        alert( $(this).closest('tr').html() );
});

Answer 4

只需使用最近（）功能..

＆＃13;

$('.inpu').click(function(){

alert( $(this).closest('tr').prop('class') );
      
$(this).closest('tr').addClass('abc')  ;          
        });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<table>
    <tr class="a">
        <td>name</td>
        <td>text</td>
        <td>text22222</td>
        <td><input type="checkbox" class="inpu" /></td>
    </tr>
    <tr class="a">
        <td>name</td>
        <td>text</td>
        <td>text2</td>
        <td><input type="checkbox" class="inpu" /></td>
    </tr>
</table>

＆＃13;

jQuery将DOM导航到表中最接近的tr

4 个答案: