我想当我单击第一个复选框“ noone”时,其他复选框将被取消选中,并且当其他复选框被选中时,“ noone”复选框也将被取消选中,有人可以告诉我如何吗?
<p>
<input id="noone" type="checkbox" />no one</p>
<div id="noneAbove" class="hidden">
<p>
<input id="btn1" type="checkbox" /> button 1
</p>
<p>
<input id="btn2" type="checkbox" />button 2</p>
</div>
我的代码是
$(function(){
$('#noone').on('click',function(){
var noone = document.getElementById("noneAboveCheck");
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
if (noone.checked == true){
btn1.checked = false;
bnt2.checked = false;
} else {
none.checked = false;
}
});
});
只需对代码稍作更改,即可正常工作。
$(function(){
$('#noone').on('change',function(){
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
if ($(this).prop('checked') === true){
$('#btn1').prop('checked', false);
$('#btn2').prop('checked', false);
}
});
$('#btn1, #btn2').on('change',function(){
var noone = document.getElementById("noneAboveCheck");
if ($(this).prop('checked') === true){
$('#noone').prop('checked', false);
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
<input id="noone" type="checkbox" />no one</p>
<div id="noneAbove" class="hidden">
<p>
<input id="btn1" type="checkbox" /> button 1
</p>
<p>
<input id="btn2" type="checkbox" />button 2</p>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句