jquery-mobile - JQueryMobile - 按钮

Question

如何使用 jquery mobile 在编码中禁用按钮？

<div data-role="button" id="val">Value</div>

[注意:我想在编码中禁用按钮，而不是在设计时]

Answer 1

实时示例:http://jsfiddle.net/LHG4L/5/

HTML:

<div data-role="page">
    <div data-role="content">
        <input type="button" id="theButton" name="theButton" value="The Button">
    </div>
</div>

JS:

$('#theButton').attr('disabled',true);

更新:

链接按钮示例:

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

Links styled like buttons have all the same visual options as true form-based buttons below, but there are a few important differences. Link-based buttons aren't part of the button plugin and only just use the underlying buttonMarkup plugin to generate the button styles so the form button methods (enable, disable, refresh) aren't supported. If you need to disable a link-based button (or any element), it's possible to apply the disabled class ui-disabled yourself with JavaScript to achieve the same effect.