【问题标题】:disable button in jquery on checkbox在复选框上禁用jquery中的按钮
【发布时间】:2020-07-07 09:54:45
【问题描述】:

如果用户选中复选框,则应启用该按钮。如果没有,则应禁用按钮。

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>

【问题讨论】:

标签: javascript html jquery button disable


【解决方案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>

【讨论】:

  • 谢谢我试试@
  • @MHasan 如果此答案符合您的需求,请不要忘记接受并投票。
  • 接受@
猜你喜欢
  • 2023-03-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-01-28
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2022-10-13
相关资源
最近更新 更多