javascript - 使用jquery预设html复选框

Question

这段代码，

$("#x").removeAttr("checked").removeAttr("unchecked").attr("foo","bar");

此 html 输入的结果:

<input type="checkbox" id="x" foo="bar">

还有这个:

$("#x").removeAttr("checked").removeAttr("unchecked").attr("checked","true");

结果:

<input type="checkbox" id="x" checked="checked">

这是怎么回事？尽管有这个 checked="checked"属性，复选框仍然顽固地保持未选中状态。

切换 HTML 输入的 checked 属性的最佳方法是什么？

Answer 1

要切换选中状态，请使用 .prop() 而不是 .attr():

$('#x').prop('checked',true);
$('#x').prop('checked',false);

如果你想要另一个按钮来切换你可以使用的复选框:

var $x  = $('#x'); // don't query every click - Credit: Roko :) 
$('.button').click(function(){      
    $x.prop('checked', !$x.is(':checked'));
})