根据复选框已选中的属性，无法在按钮中添加/删除禁用的属性 [英] Unable to add/remove disabled attribute in button based on checkbox checked property

问题描述

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>
  }

我想基于复选框已选中属性启用/禁用Set Up Account按钮.如果选中了复选框，则启用按钮，否则禁用.在页面加载时，我禁用了按钮

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

我面临的问题是

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

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.

注意:我正在使用Jquery mobile 1.2和jQuery 1.7.另外，在此处发布我在google中搜索之前，根据复选框的选中值，在启用和禁用按钮下还有很多发布.但没有一个能解决我的问题.

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.

出什么问题了?请帮助我

What's the problem? please help me

谢谢...

推荐答案

由于Jquery Mobile，该按钮未启用.在JQM中，我们需要在操作表单元素的同时刷新表单元素

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

解决方案是

    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();
    });
});

通过添加解决了问题

.button('refresh');

这篇关于根据复选框已选中的属性，无法在按钮中添加/删除禁用的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！