問題與檢測默認的HTML checked屬性的複選框

Question

我有點新的jQuery的。我在用下面的代碼工作的問題，特別是復位鍵，

<script> 
$(function() 
{ 
    $(document).ready(function() 
    { 
     $("input[type=checkbox][checked]").each(
     function() 
     { 
      var cell = $(this).closest('td'); 
      if($(this).attr('checked')) 
      { 
       cell.toggleClass('check'); 
      } 
     }); 
    }); 
    $('#bay :checkbox').click(function() 
    { 
     var cell = $(this).closest('td'); 
     cell.toggleClass('check'); 
    }).change(); 
    $('#reset').click(function() 
    { 
    $('#bay input[type=checkbox]').each(function() 
    { 
     var cell = $(this).closest('td'); 
     if ($(this).is('checked')) 
     { 
     //alert("yes"); 
      cell.addClass('check'); 

     } 
     else 
     { 
      cell.removeClass('check'); 
     //alert("no"); 

     } 
     }); 
    }); 
}); 
</script> 

<input type="checkbox" checked>Blah 

對於被點擊復位按鈕，當某種原因，該腳本僅執行cell.addClass if語句。基本上，重置按鈕用作還原，如果HTML代碼中沒有默認屬性，則應從每個中刪除添加的類#check。

我想這樣做輸入複選框的檢查與檢查屬性的低效的方法，和一個沒有，跑在FF和鉻細，但在IE失敗。只有當您按兩次重置按鈕時，它纔會起作用。

$('#reset').click(function() 
{ 

    $("input[type=checkbox][checked]").each(
    function() 
    { 
     var cell = $(this).closest('td'); 
     cell.addClass('check'); 
    }); 
    $("input[type=checkbox]:not([checked])").each(
    function() 
    { 
     var cell = $(this).closest('td'); 
     cell.removeClass('check'); 
    }); 
}); 

任何幫助將不勝感激！

編輯：每請求，以下是HTML代碼的樣品重量/工作（但低效的）jQuery代碼http://jsfiddle.net/uxjCT/9/。

編輯2：*我簡化了代碼的「重置」部分，但它仍然不能在IE中工作。任何人都知道這是否是一個無法解決的IE問題？從本質上講，我試圖讓復位功能，恢復到缺省的HTML「選中」屬性，對於已經在HTML屬性，與樣式表一起輸入複選框。 IE是目前唯一的一個痛苦的罪魁禍首。

$('#reset').click(function(){ 

$('#bay input[type=checkbox]').each(function() 
{ 
    var attr = $(this).is("[checked]"); 
    var cell = $(this).closest('td'); 

    if (typeof attr !== 'undefined' && attr !== false) 
    { 
     alert("checked"); 
     cell.addClass('check'); 
    } 
    else 
    { 
     alert("unchecked"); 
     cell.removeClass('check'); 
    } 
    }); 
}); 

出於某種原因，var attr = $(this).is("[checked]");不會拿起HTML中「選中」屬性，但是會拿起如果複選框已被選中，這可能比默認的HTML屬性不同。

同樣，任何幫助，將不勝感激！

Demo'd代碼：http://jsfiddle.net/uxjCT/55/

Answer 1

這應該工作。修改您的代碼

$('#reset').click(function(){ 
    $('#bay input:checkbox').each(function() 
    { 
     var cell = $(this).closest('td'); 

     if (this.checked) 
     { 
      //alert("yes"); 
      cell.addClass('check'); 
     } 
     else 
     { 
      cell.removeClass('check'); 
      //alert("no"); 

     } 
    }); 
}); 

您可以試用working demo。

Answer 2

的代碼檢查，如果被選中複選框是

$(this).is(':checked') 

不

$(this).is('checked') 

你的代碼與這種變化。

Answer 3

試試這個...

$('#reset').click(function(){ 

     cell.removeClass('check');//First remove class from all cell 
     $('#bay :checked').each(function() 
     { 
       cell.addClass('check');//add class only to checked cells 

     }); 
    });