jQuery复选框val()始终返回on

Question

你好，在进行了大量搜索后，我找到了一种检查复选框的方法。但是我不知道问题出在哪里。当我选择它时，其val()始终返回on。同时，取消选择时也是如此。我认为取消选择时应该返回null。请帮忙解决。

$(document).ready(function(){
$('#ch').change(function(){
    alert($(this).val());
});
 });

以及HTML

<input type="checkbox"  id="ch"/> Check it out...

- Shameer

Answer 1

您有多种选项来检查您的复选框是否被选中或未选中，

alert($(this).is(":checked")); ////return true if checked

或者

alert(this.checked); //return true if checked

或者

<input type="checkbox" id="ch" checked/>
alert($(#ch).attr( "checked")); //return checked if checked 

或者

alert($(this).prop( "checked")); //return true if checked

- Deepak Ingole

Answer 2

我认为你想知道的是它是否被选中，你可以检查选中状态。

alert(this.checked); // or $(this).is(':checked')

演示: Fiddle

- Arun P Johny

---

工作正常，但为什么使用alert($(this).checked)不起作用？两者都是相同的吗？ - Shameer

No. $(this)[0].checked 与 this.checked 是相同的。this.checked 不是 jQuery。 - mplungjan

@Shameer，checked 属性属于 DOM 元素，而 $(this) 返回的是 jQuery 包装器元素，而不是 DOM 元素，因此它没有 checked 属性。 - Arun P Johny

Answer 3

您可以这样做：

alert($(this).prop('checked'));

如果您想获取复选框的值，那么您需要添加value属性，例如：

<input type="checkbox" value="your_value" id="ch"/> Check it out...

and js

$('#ch').change(function(){
    alert($(this).val()); //gives you 'your_value' in any case
});

$(this) 是一个 jQuery 集合，你可以使用它来调用 jQuery 方法获取相关数据。如果你想使用 .checked，你可以采用以下任一方式：

this.checked
//or
$(this)[0].checked

那意味着：

$(this)[0] == this

Demo:: jsFiddle

- Sudhir Bastakoti

---

为什么使用alert($(this).attr('checked'))无法正常工作？attr和prop有什么区别？ - Shameer

Answer 4

尝试：

$(document).ready(function(){
    $('#ch').change(function(){
        alert($(this).is(':checked'));
    });
});

演示范例

- Kiran

Answer 5

你需要为表单对象赋值属性，以便.Val()返回可操作的内容：

<input type="checkbox" value="some_usefull_value" id="ch"/>

- Goos van den Bekerom