Question

我有四个复选框，如下所示

<label> <input type="checkbox" id="ca" value="0" name="ca"> CA </label>
<label> <input type="checkbox" id="nv" value="0" name="nv"> NV </label>
<label> <input type="checkbox" id="tx" value="0" name="tx"> TX </label>
<label> <input type="checkbox" id="fl" value="0" name="fl"> FL </label>

当用户选中/取消选中每个复选框时，它应该更改相应复选框的值（check = 1和uncheck = 0）

我知道我可以通过为每个复选框单独编写代码来实现。

但是，我想知道我们是否可以使用jQuery在一行（或更少的行）中编写它

Answer 1

你可以绑定＆＃34;更改＆＃34;监听每个复选框。请参阅jQuery＆＃39; .on()和.change() 然后设置＆＃34;更改＆＃34;复选框的值取决于是否已选中或未选中。

下面，我使用JavaScript's this keyword引用了点击的复选框，并使用ternary operator根据其＆＃34;已选中＆＃34;设置其值。状态。

＆＃13;

jQuery('input[type=checkbox]').on('change', function() {
  this.value = this.checked ? 1 : 0;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input type="checkbox" id="ca" value="0" name="ca">CA</label>
<label><input type="checkbox" id="nv" value="0" name="nv">NV</label>
<label><input type="checkbox" id="tx" value="0" name="tx">TX</label>
<label><input type="checkbox" id="fl" value="0" name="fl">FL</label>

＆＃13;

jQuery - 在组复选框中设置单个复选框的值

1 个答案: