當單擊複選框時禁用/啓用輸入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。