Javascript + jquery复选框验证？

Posted 2023-05-09

【中文标题】Javascript + jquery复选框验证？

【英文标题】：Javascript + jquery checkbox validation?

【发布时间】：2017-09-05 21:49:58

【问题描述】：

我必须验证复选框。

if($("#update_user_modal #room1").attr('checked', false)) room1Val = 0;

这工作正常。但我必须检查它是否也没有检查。 else 方法不起作用。

if($("#update_user_modal #room1").attr('checked', true)) room1Val = 1;

这也有效。

但是！当我像这样使用两者时：

  if ($("#update_user_modal #room1").attr('checked', false)) room1Val = 0;

  if($("#update_user_modal #room1").attr('checked', true)) room1Val = 1;

它有时会起作用。

我也尝试使用 .prop。 我做错了什么？

【参考方案1】：

JQuery：使用.is(':checked')

if ($("#update_user_modal #room1").is(':checked') room1Val = 0;
 else room1Val = 1;

javascript：使用复选框的.checked 属性。

if document.getElementById('chkboxName').checked room1Val = 0;
 else room1Val = 1;

【参考方案2】：

尝试使用is(":checked") 选项。

您的代码将如下所示：

if (!$("#update_user_modal #room1").is(":checked")) room1Val = 0;

if($("#update_user_modal #room1").is(":checked")) room1Val = 1;

查看documentation了解更多信息。

【参考方案3】：

根据 W3C 表单规范，checked 属性是 boolean 属性，表示如果对应的属性为真 该属性完全存在——即使，例如，该属性 没有值或设置为空字符串值甚至“假”。这是 所有布尔属性都为真。

尽管如此，关于检查的最重要的概念是要记住 属性是它不对应于选中的属性。这 属性实际上对应于 defaultChecked 属性和 应该只用于设置复选框的初始值。这 选中的属性值不随状态改变 复选框，而选中的属性确实如此。因此， 确定是否选中复选框的跨浏览器兼容方法是 使用属性：

if ( elem.checked )
if ( $( elem ).prop( "checked" ) )
if ( $( elem ).is( ":checked" ) )

Source

【参考方案4】：

您不是读取属性值，而是写入它。不要使用attr 的第二个参数——只使用一个：

room1Val = +$("#update_user_modal #room1").attr('checked'))

这将一次性完成这两种情况，因为它返回一个布尔值。 + 将其设为 0 或 1。

其次，对于这种情况，最好使用prop 而不是attr：

room1Val = +$("#update_user_modal #room1").prop('checked'))

【讨论】：

你的答案比他们的好;)

【参考方案5】：

你应该这样做：

if ($("#update_user_modal #room1").prop('checked')) 
    room1Val = 1;
 else 
    room1Val = 0;