Question

我试图基于复选框禁用/启用按钮，但我无法执行此操作。这是我工作的示例。对于启用和禁用，必须使用不同的按钮。

function toggleContinue() {
  $(document).ready(function() {    
        $("#swpRequired").click(function() {
              $("input,select").change(function() {
                $("#disableContinue").attr("style", "display:inline-block");
                $("#continueButton").attr("style", "display:none");
              });
         });

         $("#swpRequired").click(function() {
              $("input,select").change(function() {
                 $("#disableContinue").attr("style", "display:none");
                 $("#continueButton").attr("style", "display:inline-block;");
               });
          });
    });
 }

Answer 1

尝试一下。使用jquery的prop方法

function s()
{
if($("#a").prop('disabled')==false)
$("#a").prop('disabled','true')
else
$("#a").removeAttr('disabled')

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox"  onchange="s()" id="b"/>enable
<input type="button" value="click" id="a">

Answer 2

您可以根据复选框的值使用attr()禁用/启用按钮：

$(document).ready(function() {
  $("#swpRequired").click(function() {
      $("#continueButton").attr("disabled", this.checked);
    });
});

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

<input type="checkbox" id="swpRequired" />
<button id="continueButton">continue</button>

Answer 3

您可以使用change event并借助disabled的{{1}}属性的帮助。

解决方案如下：

button

$(document).on('change', "#checkbox", function()
{
  if ($(this).prop("checked") == true)
  {
    $("#btn").prop('disabled',true)
  }
  else
  {
    $("#btn").prop('disabled',false)
  }
});

如何添加/修改现有的jQuery功能

3 个答案: