jQuery实时获取checkbox状态问题

在最近的项目开发中，使用jQuery操作checkbox时，发现一个问题。

Html代码如下：

<body>
    <div>
       <inputtype="checkbox"id="test">
    </div>
    <buttonid="btn">click</button>
    <div id="msg"></div>
</body>

JS代码如下：

1 <scripttype="text/javascript">
2   $(function() {
3     $("#btn").click(function(){
4       alert($("#test").attr("checked"));
5     });
6   });
7 </script>

当未选中checkbox时，单击click按钮，弹出undefined，当手动选中checkbox时，单击click按钮，还是弹出undefined，如果checkbox初始化为已选中，则两次都弹出checked。也就是说通过attr方法无法实时获取checkbox的状态。

解决办法是使用is()方法：

修改代码如下：

<script type="text/javascript">
  $(function(){
    $("#btn").click(function(){
      alert($("#test").is(":checked"));
    });
  });
</script>

jQuery实时获取checkbox状态问题

推荐阅读