复选框 jquery 中的禁用按钮

Question

如果用户选中了该复选框，则应启用该按钮。如果不是，则应禁用按钮。

function test(){
  if($(this).val() === true){      //not working
      $('#send_button').prop('disabled', false);
  } 
  else if($(this).val() === false){
      $('#send_button').prop('disabled', true);
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>

<input id="ischeck" type="checkbox" name="ischeck" value=true>
<label for="ischeck">ischeck</label><br>        

<button id="send_button" class="btn btn-primary pull-right" onclick="test()">Send</button>

Answer 1

您应该在输入复选框 dom 元素上添加一个事件侦听器，以便像这样捕获值更改（查看文档 here）：

$("#ischeck").change(...);

然后，检查输入的值，并相应地设置禁用按钮属性：

 $('#send_button').prop('disabled', !this.checked);

注意：不要忘记对于复选框输入类型的情况，为了设置初始值，您应该使用属性这样检查（更多信息 here）：

<input id="ischeck" type="checkbox" name="ischeck" checked=true>

下面是一个完整的工作示例：

$("#ischeck").change(function () {
    // You want to se the property disable of the send button with the oposite value of the input;
    // Example: Input: true [then] Button disabled: false
    $('#send_button').prop('disabled', !this.checked);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>

<input id="ischeck" type="checkbox" name="ischeck" checked=true>
<label for="ischeck">ischeck</label><br>        

<button id="send_button" class="btn btn-primary pull-right" onclick="test()">Send</button>

复选框 jquery 中的禁用按钮

disable button in jquery on checkbox

html

javascript

jquery

button

disable