jquery - 复选框值总是返回“on”？

Question

我正在尝试返回复选框的值以启用和禁用按钮。制作复选框不是问题，问题是复选框值总是返回。我应该如何获得指示复选框是否被选中的值？

HTML：

<form>
    <input type="checkbox" id="checkbox" /> <label>Do you agree  </label><br />
    <input type="button" value="Continue" id="button" disabled="disabled" />
</form>  

Javascript：

$('#checkbox').change(function(){
    var checkboxValue = $(this).val();
    alert(checkboxValue);
});

Answer 1

尝试使用prop ('checked');

var checkboxValue = $(this).prop('checked');

Answer 2

看来你需要checked

var checkboxValue = this.checked;

Answer 3

这里发生了几件事

1. 复选框原样没有值
2. 您应该检查它是否已检查

尝试这个

$('#checkBox').prop('checked');

如果它被选中，如果它没有被选中，你应该返回 true 和 false。

Answer 4

尝试使用（如果您使用的是 jQuery 1.6+）：

var checkboxValue = $(this).prop('checked');

http://api.jquery.com/prop/

这应该返回一个true或false正确。

Answer 5

或者如何使用:checkedSelector？

$(this).is(':checked') // returns true if checked and false otherwise

Answer 6

尝试使用is(':checked')而不是.val

$('#checkbox').change(function(){
    var checkboxValue = $(this).is(':checked');
    alert(checkboxValue);
});

它返回真或假

另请参阅 jQuery val() 和复选框

Answer 7

这是基于@gdoron的回答的代码，没有jquery。

document.getElementById("checkbox").addEventListener("change", function() {
    if (this.checked) {
        //Whatever u want to do if checked
    }
    else {
        //Whatever u want to do if not checked
    }
})

尝试选中/取消选中以下代码段中的复选框以查看此操作...

document.getElementById("checkbox").addEventListener("change", function() {
        if (this.checked) {
            //Whatever u want to do if checked
            alert("u check");
        }
        else {
            //Whatever u want to do if not checked
            alert("u uncheck");
        }
    })

<input type="checkbox" id="checkbox" />Coconuts?