繁体   English   中英

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

[英]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按钮。 如果选中复选框,则启用按钮,否则禁用。 在页面加载中,我禁用了该按钮

我面临的问题是

在页面加载时,其禁用按钮,但不基于复选框的更改事件添加/删除禁用的属性,我在Firebug中进行了检入,它基于选中和未选中的值正确进入了循环。

注意:我正在使用Jquery mobile 1.2和jQuery 1.7。 另外,在这里发布我在谷歌搜索之前,根据复选框的选中值,在启用和禁用按钮下有很多发布。 但没有一个解决我的问题。

有什么问题? 请帮我

谢谢...

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

要添加属性:

.prop("disabled", true);

删除属性:

.prop("disabled", false);

在寻找以上信息时,我偶然发现了这个问题,所以我想分享一下。

由于Jquery Mobile,无法启用按钮。 在JQM中,我们需要在处理表单元素的同时刷新它

解决方案是

    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');

像这个

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

尝试这个

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

演示

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM