jQuery 无法根据复选框选中的属性在按钮中添加/删除禁用的属性

Unable to add/remove disabled attribute in button based on checkbox checked property

提问by subha

Jquery:

查询：

<script type="text/javascript">

function  enableDisableButton() {

    var isChecked = ($('input[name=ignore-checkbox]').is(':checked'));

    if (isChecked == true) {
        $("button[name=set-up-account]").removeAttr("disabled");
    }
    else {
        $("button[name=set-up-account]").attr("disabled", "disabled");
    }

}

$('#mobilePage').live('pageinit', function (event) {    //document ready for jquery mobile

    enableDisableButton();

    $('#ignore-checkbox').bind("change", function () {
        enableDisableButton();
    });

});
  </script>

Html:

网址：

 @using (Html.BeginForm("Account", "SetUpAccount", FormMethod.Post, new { @id = "account-set-up", @data_ajax = "false" }))
 {       

     <div class="ui-grid-a field">
        <div class="ui-block-a" style="width:140px;">
         <label for="ignore-checkbox">Ignore</label>
         <input type="checkbox" name="ignore-checkbox" id="ignore-checkbox"/>
        </div>
     </div>

     <div style="width:100%;float:left;">
         <button type="submit" name="set-up-account" id="set-up-account"  data-inline="true"  data-mini="true">Set Up Account</button>
     </div>
  }

I want to enable/disable the Set Up Accountbutton based on check box checked property. If checkbox is checked, then enable the button, else disable. On page load i am disabling the button

我想Set Up Account根据复选框选中的属性启用/禁用按钮。如果复选框被选中，则启用按钮，否则禁用。在页面加载我禁用按钮

The problem i am facing is,

我面临的问题是，

On page load, its disabling the button, but its not adding/removing the disabled attribute based on change event of check box, i checked in firebug, its entering the loop properly based on checked and unchecked value.

在页面加载时，它禁用了按钮，但它没有根据复选框的更改事件添加/删除禁用的属性，我检查了萤火虫，它根据选中和未选中的值正确进入循环。

Note: I am using Jquery mobile 1.2 and jquery 1.7. Also before posting here i searched in google, there are many postings under enabling and disabling of button based on checkbox checked value. but none solves my issue.

注意：我使用的是 Jquery mobile 1.2 和 jquery 1.7。同样在我在这里发帖之前，我在谷歌搜索过，根据复选框选中的值启用和禁用按钮下有很多帖子。但没有一个能解决我的问题。

What's the problem? please help me

有什么问题？请帮我

Thanks...

谢谢...

采纳答案by subha

Its not enabling the button because of Jquery Mobile. In JQM, we need to refresh the form element, while manipulating it

由于 Jquery Mobile，它没有启用按钮。在JQM中，我们需要刷新表单元素，同时对其进行操作

The solution is

解决办法是

    function  enableDisableButton() {

    var isChecked = ($('input[name=ignore-checkbox]').is(':checked'));

    if (isChecked) {
        $("button[name='set-up-account']").removeAttr("disabled").button('refresh');
    }
    else {
        $("button[name='set-up-account']").attr("disabled", "disabled").button('refresh');
   }
}

$('#mobilePage').live('pageinit', function (event) {

    enableDisableButton();

    $('#ignore-checkbox').bind("change", function () {
        enableDisableButton();
    });
});

The problem was solved by adding

问题是通过添加解决的

.button('refresh');

回答by Josh the Aspie

I'm not sure if this will help solve your main problem, but according to http://api.jquery.com/prop/you should be adding and removing the disabled property using the .prop() function, not the .attr() and .removeAttr() functions.

我不确定这是否有助于解决您的主要问题，但根据http://api.jquery.com/prop/，您应该使用 .prop() 函数而不是 .attr 添加和删除禁用的属性() 和 .removeAttr() 函数。

To add the property:

添加属性：

.prop("disabled", true);

To remove the property:

要删除属性：

.prop("disabled", false);

I stumbled across this question while looking for the above info, so I thought I'd share.

我在寻找上述信息时偶然发现了这个问题，所以我想我会分享。

回答by jswolf

Like this one

像这个

  $('#setagb').change(function(){
        if ($(this).is(':checked'))
        {
            $("#submit").removeAttr("disabled");
        }
        else
        {
            $("#submit").attr( "disabled", "disabled" );
        }               
  });

回答by Om3ga

Try this

尝试这个

$("input[name=ignore-checkbox]").click(function() {
  $("button[name=set-up-account]").attr("disabled", this.checked);
});

DEMO

演示