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

Question

我可以使用 jquery 1.6 来完成这项工作，但是我升级到 1.8 并且无法让它工作。这是jfiddle：链接

和代码：

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

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

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 文档http://api.jquery.com/prop/

应该使用 .prop() 方法来设置禁用和检查，而不是 .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);​

应该可以工作

Answer 6

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

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

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