Question

单击其他复选框时，我正在尝试启用和禁用多个复选框。

如果要检查box1或box2或box3中的任何一个，我想禁用Cash，Square，Paypal。否则，我想启用box1，box2，box3。

我目前有以下代码：

var check = $("#checkit1");

$("#checkit1").on('click',checkStatus);
function checkStatus(){
    
if(check.is(':checked'))
{
    $("#click1").prop('disabled', true);
    $("#click2").prop('disabled', true);
    $("#click3").prop('disabled', true);
}
else{
    $("#click1").prop('disabled', false);
    $("#click2").prop('disabled', false);
    $("#click3").prop('disabled', false);
}
    
}

<br>
<div>
    <input type="checkbox" id="checkit1" /> Cash <br>
    <input type="checkbox"  id="checkit2" /> Square <br>
    <input type="checkbox"  id="checkit3" /> Paypal <br>
    
    ------------------------------------------------<br>
    
    <input type="checkbox"  id="checkit4" /> BBT <br>
    <input type="checkbox"  id="checkit5" /> Citi <br>
    **<input type="checkbox"  id="click1" /> dep <br>
    **<input type="checkbox"  id="click2" /> trans <br>
    **<input type="checkbox"  id="click3" /> check <br>
    
</div>

我在做什么错了？

Answer 1

有多种方法可以实现此目的-一种方法（that retains your code's general structure）是基于此选择要切换禁用的所有复选框：

var checkboxes = $("#checkit1, #checkit2, #checkit3");

然后在click处理程序中使用以下选中的复选框来确定是否有:checked像这样：

$(checkboxes).is(':checked') // Returns true is at least one checkbox in selected checkboxes checked

然后可以在脚本中使用这两行来实现所需的目标，如下所示：

// Select checkboxes used to control/toggle disable of target checkboxes
var checkboxes = $("#checkit1, #checkit2, #checkit3");

checkboxes.on('click',checkStatus);

function checkStatus() {

  // if at least one checkbox in selected checkboxes is checked then 
  // disable target checkboxes
  if($(checkboxes).is(':checked'))
  {
      $("#click1").prop('disabled', true);
      $("#click2").prop('disabled', true);
      $("#click3").prop('disabled', true);
  }
  else{
      $("#click1").prop('disabled', false);
      $("#click2").prop('disabled', false);
      $("#click3").prop('disabled', false);
  }        
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<br>
<div>
    <input type="checkbox" id="checkit1" /> Cash <br>
    <input type="checkbox"  id="checkit2" /> Square <br>
    <input type="checkbox"  id="checkit3" /> Paypal <br>
    
    ------------------------------------------------<br>
     
    **<input type="checkbox"  id="click1" /> box1 <br>
    **<input type="checkbox"  id="click2" /> box2 <br>
    **<input type="checkbox"  id="click3" /> box3 <br>
    
</div>

Answer 2

尽管即时消息所显示的代码远非完美（递归过多，将难以迅速扩展选项的数量等），但它确实达到了您的要求，应该可以帮助您开始构建更好的代码。

{
    "_id" : ObjectId("(Object ID here"),
    "employeeName": "Test",
    "time": "2014-11-21:17:15:00"
}

此代码的关键点是使用or运算符（||）。这使您可以将支票链接在一起，例如，我将三个支票链接在一起，说：“如果检查或检查2或检查3，则执行循环”。

This是一个很好的链接，可帮助您理解操作员（无论如何都是基础知识）。

Answer 3

//add a change event listener to all the options by class
var $disableCity = $('.disableCiti').on('change', function (e) {
  //set all the checkboxes to disabled if any of the top checkboxes
  //are checked, regardless of if the one we just changed is unchecked
  //or not
	$('.citiInput').prop('disabled', $disableCity.filter(':checked').length);
} );

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--

Added classes to the relevant checkboxes so we could target them all.

-->
<div>
  <div><input type="checkbox" id="checkit1" class="disableCiti"> Cash</div>
  <div><input type="checkbox" id="checkit2" class="disableCiti"> Square</div>
  <div><input type="checkbox" id="checkit3" class="disableCiti"> Paypal</div>
  <div>------------------------------------------------</div>
  <div><input type="checkbox" id="checkit4"> BBT</div>
  <div><input type="checkbox" id="checkit5"> Citi</div>
  <div>** <input type="checkbox" id="click1" class="citiInput"> dep</div>
  <div>** <input type="checkbox" id="click2" class="citiInput"> trans</div>
  <div>** <input type="checkbox" id="click3" class="citiInput"> check</div>
</div>

jQuery的：禁用/启用多个复选框，如果另一个复选框被选中

3 个答案: