jquery - 親の背景を切り替える方法は？

Question

チェックボックス付きのシンプルなテーブルがあります。チェックすると、行の色を変更する必要があります。

<tr height="35">
    <td><input type="checkbox" ></td>
    <td>Name</td>
    <td>Surname</td>
</tr>

現時点では私はそれをします

jQuery('input[type="checkbox"]').click(function(){
    jQuery(this).parent().parent().css('background-color', 'red');
});

しかし、.parent().parent()これは良い考えではないと思います...また、背景を切り替える方法はありますか？たぶん、チェックした後、どういうわけかアリを変更しますか？

Answer 1

代わりに使用できますclosest()：

$("input[type='checkbox']").click(function(){
    $(this).closest("tr").css("background-color", "red");
});

Answer 2

あなたはこのようにすることができます

  $("input[type='checkbox']").click(function(){
         $(this).parents("tr:first").css("background-color", "red");
  });

参考：http ://api.jquery.com/parents/

デモ: http://jsfiddle.net/qGZPP/

Answer 3

チェックボックスのクリック時に背景色を切り替えるには、これを試してください。

jQuery('input[type="checkbox"]').click(function(){
    var self = jQuery(this);
    var parentTr = self.closest("tr");
    if(this.checked)
      parentTr.css('background-color', 'red');
    else 
      parentTr.css('background-color', 'default-color or empty if no default color');
});

このデモをチェック