使用jQuery禁用JQuery Mobile按钮

Question

这是我的jQuery移动按钮。这可能很容易。我可以禁用HTML按钮，但似乎无法使用此标记。

<a href="" data-role="button"  class="answer_but" id="a" data-theme="b" data-answer="1">

这可能是一个简单的问题。谢谢。

- L-Samuels

Answer 1

jQuery Mobile中禁用按钮

实例展示：http://jsfiddle.net/XRjh2/16/

更新：

链接按钮示例：

• http://jsfiddle.net/gRLYQ/6/

JS

var clicked = false;

$('#myButton').click(function() {
    if(clicked === false) {
        $(this).addClass('ui-disabled');
        clicked = true;
        alert('Button is now disabled');
    } 
});

$('#enableButton').click(function() {
    $('#myButton').removeClass('ui-disabled');
    clicked = false; 
});

HTML

<div data-role="page" id="home">
    <div data-role="content">

        <a href="#" data-role="button" id="myButton">Click button</a>
        <a href="#" data-role="button" id="enableButton">Enable button</a>

    </div>
</div>

注意：- http://jquerymobile.com/demos/1.0rc2/docs/buttons/buttons-types.html

链接样式的按钮与真正基于表单的按钮具有相同的视觉选项，但存在一些重要区别。基于链接的按钮不是按钮插件的一部分，只是使用底层的buttonMarkup插件生成按钮样式，因此不支持表单按钮方法（启用、禁用、刷新）。如果需要禁用基于链接的按钮（或任何元素），可以使用JavaScript自己应用ui-disabled类来实现相同的效果。

- Phill Pafford

---

谢谢@phil。是的，它可以正常工作，但是将我的按钮更改为您指定的HTML标记会破坏我的应用程序中的某些功能。您有任何建议吗？我该如何禁用给定的按钮标记？ - L-Samuels

Answer 2

您可以将类设置为“ui-disabled”来禁用几乎所有元素或按钮。

<a data-role="filter-button" data-timeframe="month" class="ui-disabled">Date</a>

- Tyler Sammy

Answer 3

嗯 - 试试这个（假设'a'是您的jqm按钮的ID）：

// To disable
$("#a").attr("disabled","disabled");

// and enable
$("#a").attr("disabled","");

- Jay Are

---

我尝试过了，似乎不起作用。它可以使用原始按钮，但不能使用jQuery Mobile按钮。 - L-Samuels

Answer 4

我看了一下，也无法让它工作。然后我的同事建议将vclick添加到live中，现在它可以工作了。

    //Disable Continue Button
        $('#icon-continue').live( 'vclick',function(event){

    var clicked = false;

             if(clicked === false) {
              $(this).addClass('ui-disabled');
              clicked = true;
              alert('Button is now disabled');   
             }
});

- imaginethepoet