【问题标题】:Allow checking to a checkbox even after adding attr("checked", false)即使在添加 attr("checked", false) 后也允许检查复选框
【发布时间】:2017-03-03 17:45:24
【问题描述】:

我不确定 a 是否正确地制定了标题,但逻辑是这样的。

我有 4 个复选框,3 Yes1 No。选择 3 Yes 将取消选中 No,选择 No 将取消选中 Yes

我的 jQuery 如下所示:

var yes = $("input[type=checkbox].yes");

if (yes.length == yes.filter(":checked").length) {
    $("#no").attr("checked", false);
} else if($("#no").is(":checked")) {
    yes.attr("checked", false);
} else {
    // do nothing
}



有用。但是,如果我勾选了所有Yes,我将无法选择No。相反,我需要取消选中 1 Yes 以选择 NoNo 也一样。如果我选中 No,则所有 Yes 都将被取消选中。但是,我需要取消选中 No 才能再次选择 Yes

如果选中所有 Yes,我是否仍然可以选择 No

谢谢!

更新
现在包括 HTML

<form id="checkbox-testing" >
<div class="checkform">
    <label>                        
      <input class="yes" type="checkbox" value="Yes, 1" id="yes1"><span>&nbsp;Yes, 1</span> 
    </label>
    <label>                        
      <input class="yes" type="checkbox" value="Yes, 2" id="yes2"><span>&nbsp;Yes, 2</span>
    </label>
    <label>                        
      <input class="yes" type="checkbox" value="Yes, 3" id="yes3"><span>&nbsp;Yes, 3</span>
    </label>
    <label>                        
      <input type="checkbox" value="No" id="no"><span>&nbsp;No</span>
    </label>
</div>
<input type="submit" value="Test" />
</form>

【问题讨论】:

  • @guradio。你能详细说明一下吗?谢谢!
  • 将你的html和js一起添加到op中
  • 如果这是一个二进制状态 - 要检查一个或另一个,那么也许您应该使用单选按钮输入
  • 更新 - 我刚刚修改了我的答案以提供一个单选按钮来选择或其他选项和一个按钮来清除单击时选中的属性。如果状态是一个或另一个,并且选项是相互排斥的,那么单选按钮输入会更好。
  • @gavgrif。用户应该能够选择多个项目,这就是使用复选框的原因

标签: jquery checkbox


【解决方案1】:

使用 .prop() 而不是 .attr() 来测试检查的属性 - 以下 sn-p 使用 .prop 然后使用 .change() 事件 - 在这种情况下,我只是 conseol.logging 输出但您可以更改另一个复选框的属性。

编辑 - 我刚刚更新了我的答案,给出了一个单选按钮来选择或其他选项和一个按钮来清除单击时选中的属性。

$(document).ready(function(){
  $("input[type=radio]").change(function(){;
    console.log("yes: " + $(".yes").prop("checked"));
    console.log(" no: " + $(".no").prop("checked"));
  })
  
  $('#clear').click(function(){
    $("input[type=radio]").prop('checked',false)
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for ="yes">Yes
  <input type ="radio" name ="test" id="yes" class="yes" checked value"yes"/></label>
<label for ="no">No
  <input type ="radio" name ="test" id="no" class="no" value = "no"/>
  <hr/>
  
  
  <button type ="button" name ="test" id="clear" >Clear Value</button>
var yes = $("input[type=checkbox].yes");

if (yes.length == yes.filter(":checked").length) {
    $("#no").prop("checked", false);
} else if($("#no").is(":checked")) {
    yes.prop("checked", false);
} else {
    // do nothing
}

【讨论】:

  • 嗨@gavgrif。谢谢,但输出仍然相同。我仍然需要取消选中 1 是/否来选择另一个。
  • @thebeast22,如果你也用HTML更新你的问题会更好。
猜你喜欢
  • 2015-02-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-06-23
  • 2021-12-26
  • 1970-01-01
相关资源
最近更新 更多