javascript - jquery 设置和删除选中的属性不起作用，javascript 起作用

Question

为清楚起见，假设我有一个复选框，我想使用两个按钮选中和取消选中。

我可以使用基本的 javascript 选中/取消选中该框，但是使用 jquery，一旦删除该属性，我就无法将其重新设置...知道为什么吗？

我创建了一个基本的文件来说明：

http://jsfiddle.net/2K244/

<button id='button1'>check</button>
<button id='button2'>uncheck</button>
<input type="checkbox" id="myBox1" value="polo" />
<br/>
<button id='button3'>check</button>
<button id='button4'>uncheck</button>
<input type="checkbox" id="myBox2" value="polo" />
<br/>

$(document).ready(function () {
    $('#button1').click(function () {
        $('#myBox1').attr('checked','checked');
    });
    $('#button2').click(function () {
        $('#myBox1').removeAttr('checked');
    });
    $('#button3').click(function () {
        document.getElementById('myBox2').checked = true;
    });
    $('#button4').click(function () {
        document.getElementById('myBox2').checked = false;
    });

});

Answer 1

你应该.prop()改用。来自 jQuery 的文档.attr()：

从 jQuery 1.6 开始，.attr() 方法为尚未设置的属性返回 undefined。要检索和更改 DOM 属性，例如表单元素的选中、选择或禁用状态，请使用 .prop() 方法。

Answer 2

您现在应该使用.prop()。

http://jsfiddle.net/2K244/1/

$('#button1').click(function () {
    $('#myBox1').prop('checked',true);
});
$('#button2').click(function () {
    $('#myBox1').prop('checked', false);
});
$('#button3').click(function () {
    $('#myBox2').prop('checked', true);
});
$('#button4').click(function () {
    $('#myBox2').prop('checked', false);
});

Answer 3

要取消选中一个框，请使用 prop 功能。$('#myBox1').prop('checked', false);没有引号false

Answer 4

我不明白为什么你的不工作，但使用这个：

$("#myBox1").prop("checked",true);

$("#myBox1").prop("checked",false);

确保拥有最新版本的 jQuery。

Answer 5

可以使用 true||修改选中状态的状态。false方法中的第二个参数.prop()。

$('#btn_checked').on('click', function() {
     $('#myBox1').prop('checked', true);
});

$('#btn_unchecked').on('click', function() {
     $('#myBox1').prop('checked', false);
});

jsFiddle