найти следующий вход (родитель?) С JQuery

Question

У меня есть флажок внутри таблицы, и при нажатии на него, он будет менять цвет фона, соответственно, как так ...

$("#table tr td :checkbox").bind("click change", function() { 
    $this = $(this); // cache the jquery object 
    if($this.is(':checked')) { $this.closest('tr').css('background-color', 'lightyellow'); } 
    else { $this.closest('tr').css('background-color', '#fff'); } 
}); 

Это работает очень хорошо, однако я решил, что хотел бы пойти лучше, поэтому в любой точке таблицы, которую вы нажмете, он установит флажок и выделит строку.

Я попытался с помощью этого кода, но он не работает, к сожалению:

$("table tr").bind("click", function() { 
    $(this).parents("tr").find(":checkbox").attr('checked'); 
}); 

А вот HTML код (удален излишнему материал, чтобы улучшить читаемость ...

<td>Name</td> 
<td>Description</td> 
<td><input type="checkbox"></td> 

Любой помощь будем очень благодарны, спасибо!

Answer 1

Событие, на которое вы обращаетесь, является щелчком мыши. Родитель - это таблица, так что это не поможет. Все, что вам нужно сделать, это использовать find() из этого контекста.

Я бы использовал. Чтобы избежать нескольких обработчиков событий, когда это будет сделано.

Предполагая, что у вас есть только один флажок в строке, используйте следующее. (обратите внимание на его использует ТР внутри TBODY, чтобы избежать запуска этого на THEAD строк)

$("table>tbody>tr").live("click", function() { 
    $(this).find(":checkbox").attr('checked', 'checked'); 
}); 

UPDATE

Если вы хотите, чтобы переключить его попробовать что-то вроде

$("table>tbody>tr").live("click", function(ev) { 
     var $checkbox = $(this).find(":checkbox"); 
     //check to see we have not just clicked the actual checkbox 
     if (!$(ev.target).is(':checkbox')){ 
      $checkbox.is(':checked') ? $checkbox.removeAttr('checked') 
            : $checkbox.attr('checked', 'checked') 
     } 
}); 

Answer 2

Вы хотите изменить это:

$(this).parents("tr").find(":checkbox").attr('checked'); 

к этому:

$(this).parents("tr").find(":checkbox").attr('checked', 'checked'); 

В противном случае все, что вы делаете чтение атрибут checked, не устанавливая его.

Answer 3

Я думаю, вы просто забыть для установки значения атрибута.

$("table tr").bind("click", function() { 
    $(this).find(":checkbox").attr('checked', 'checked'); 
}); 

jQuery Docs on Attributes может быть полезен.

---

Кредит RedSquare для заметив, что .parent("tr") не требуется.