jquery 1.8.2根据复选框状态启用/禁用提交按钮

Question

我能够使用jquery 1.6来实现这一点，但我升级到1.8并且无法使其工作。这是jfiddle：link

和代码：

HTML：

 <form id="ad_form" method="post" action="">
    <input type="checkbox" id="tosId" name="tos_name" style="padding:0; margin:0" ></input>       
    <br />
    <input type="submit" id="submitId" name="submit_name" value="Submit"  /></input>
 </form>​

jQuery的：

 $('#submitId').attr('disabled', 'disabled');  

 function updateFormEnabled() 
     {
         if($('#tosId').prop('checked'))
         {
             $('#submitId').attr('disabled', '');
         } 
         else 
         {
             $('#submitId').attr('disabled', 'disabled');
         }
     }

 $('#tosId').change(updateFormEnabled);​

Answer 1

在jQuery 1.8中使用prop方法是个好主意：

function updateFormEnabled() 
{
    var checked = $('#tosId').prop('checked');
    $('#submitId').prop('disabled', !checked);
}

小提琴：http://jsfiddle.net/3aFaA/3/

Answer 2

您应该使用.prop（）来设置禁用属性

function updateFormEnabled(){         
    $('#submitId').prop('disabled', !$('#tosId').prop('checked'));        
 }

来自jQuery docs http://api.jquery.com/prop/

  

应该使用.prop（）方法来设置disabled和checked而不是.attr（）方法。

Answer 3

使用removeAttr（）

  if($('#tosId').prop('checked'))
     {
         $('#submitId').removeAttr('disabled');
     } 
     else 
     {
         $('#submitId').attr('disabled', 'disabled');
     }

Answer 4

应为$('#submitId').removeAttr('disabled');

而不是$('#submitId').attr('disabled', '');

Answer 5

$('#submitId').attr('disabled', 'disabled');  

function updateFormEnabled() 
{
    if($('#tosId').prop('checked'))
    {
        $('#submitId').attr('disabled', false);
    } 
    else 
    {
        $('#submitId').attr('disabled', true);
    }
}

$('#tosId').change(updateFormEnabled);​

应该有效jfiddle

Answer 6

$('#submitId').attr('disabled', 'disabled');  

function updateFormEnabled()
    {
        if($('#tosId').prop('checked'))
        {
            $('#submitId').attr('disabled', false);
        }
        else
        {
            $('#submitId').attr('disabled', true);
        }
    }

$('#tosId').change(updateFormEnabled);