HTML CheckBox не может быть вынесено в браузере

Question

Это мой JS код:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
      if($("#a").attr("checked")){ 
       $("#a").attr("checked",false); 
      }else{ 
       $("#a").attr("checked",true); 
      } 
     }) 
    }) 
</script> 

Это мой HTML код:

<input type="checkbox" id="a"> 
<button>123</button> 

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

Но я не думаю, что проблема с attr(), у меня есть код, который может работать корректно.

$("#delete").click(function(){ 
     if($("input[name='del_id[]']").attr("checked")){ 
      $("input[name='del_id[]']").attr("checked",false); 
     }else{ 
      $("input[name='del_id[]']").attr("checked",true); 
     } 
    }); 

Есть ли кто-нибудь, кто может мне помочь?

Answer 1

Использование prop() вместо attr() как,

$("button").click(function() { 
    $("#a").prop("checked", !$('#a').prop('checked')); 
}); 

Demo

Answer 2

Ваш код правильный, если вы используете JQuery Version 1.8.3

$(document).ready(function(){ 

     $("button").click(function(){ 
      if($("#a").attr("checked")){ 
       $("#a").attr("checked",false); 
      }else{ 
       $("#a").attr("checked",true); 
      } 
     }) 
    }) 

скрипку

http://jsfiddle.net/YXkgm/1/

Если вы используете выше 1.8 использования проп

$(document).ready(function(){ 

     $("button").click(function(){ 
      if($("#a").prop("checked")){ 
       $("#a").prop("checked",false); 
      }else{ 
       $("#a").prop("checked",true); 
      } 
     }) 
    }) 

Fiddle

http://jsfiddle.net/YXkgm/