当单击复选框时禁用/启用输入jQuery

Question

我试图只允许当用户勾选复选框时启用表单中的提交按钮。我已经启用了禁用按钮，然后在最初单击该复选框时启用该按钮，但如果我取消选中该复选框，则该按钮不会重新启用。

HTML：

<input type="checkbox" id="waivercheck"> 
<input class="submit join-button" type="submit" value="Join Now" id="joinevent" disabled> 

脚本：

$(document).ready(function() { 
    $('#waivercheck').click(function(){ 
     if($(this).checked){ 
      $('#joinevent').prop("disabled",false); 
     } else { 
      $('#joinevent').prop("disabled",true); 
     } 
    }); 
}); 

谁能帮助？

Answer 1

您可以通过this.checked访问复选框状态，而不是$(this).checked。我建议使用change事件。

$(document).ready(function() { 
    $('#waivercheck').change(function(){   
     if(this.checked){ 
      $('#joinevent').prop("disabled",false); 
     } else { 
      $('#joinevent').prop("disabled",true); 
     } 
    }); 
}); 

演示：https://jsfiddle.net/rbnndz23/

Answer 2

你的问题是与条件。

一个jQuery对象不具有checked属性，但DOM元素本身并

而不是

if($(this).checked) 

可以做

// native element has checked property 
if(this.checked) 

或者

// jQuery is() with pseudo selector 
if($(this).is(':checked')) 

Answer 3

您不需要使用$(this).checked。请尝试使用this.checked。见here。