複選框操作

Question

由於某些原因，這個小代碼阻止了用戶能夠檢查實際的複選框，並將複選標記置於其中，並且唯一的方法是點擊該行。

$('table tr').click(function() { 

    checkBox = $(this).children('td').children('input[type=checkbox]'); 

    if(checkBox.attr('checked')) 
     checkBox.removeAttr('checked'); 
    else 
     checkBox.attr('checked', 'checked'); 

}); 

Answer 1

要禁用輸入的默認複選框行爲的原因是，該複選框是tr裏面，所以當你選中該複選框您炒掉JavaScript和您切換複選框...領先到沒有發生。您必須檢查target of your event不是:checkbox。

另外，有沒有必要擔心複選框的屬性...與jQuery，你可以簡單地.click()它！

$('table tr').click(function(event) {  

    if (! $(event.target).is("input:checkbox")) 
     $(this).find('input:checkbox').click();   
}); 

Working example

Answer 2

$('table tr').click(function() { 
    $(this).find(':checkbox').each(function(){ 
     if($(this).is(':checked')) 
     { 
      $(this).removeProp('checked'); 
     } 
     else 
     { 
      $(this).prop('checked',true); 
     } 
    }); 
});