Question

由于我对jQuery mobile的了解不多，我面临着一个非常具有挑战性的问题。我已经研究了许多解决方案并实施了它们但似乎没有用

我有一个名为click me
当用户点击该按钮时，该按钮变为disabled，文字clickme变为please wait...
2秒后按钮被激活（不再是disabled），文字从please wait...变回click me。
我已经在某种程度上开始工作了。但我发现很难找到正确的HTML代码行，以便将click me更改为please wait...。
我正在尝试使用此jsfiddle文件http://jsfiddle.net/nogoodatcoding/ncSbz/1/中的示例，但将其集成到我的setTimeout代码中。

非常感谢任何帮助或指导。我的代码如下：

jquery mobile的html内容

<div class="ui-btn ui-input-btn ui-corner-all ui-shadow">
    clickme
    <input class="submit button-primary btn large send" id="wp-submit" name="up_submit" tabindex="250" type="button" value="clickme">
</div>

jquery移动代码

$(document).ready(function () {
    var clicked = false;

    $('#wp-submit').bind('click', function() {
        if(clicked == false) {
            // store reference to the button clicked
            // this allows us to access it within the 
            // setTimeout callback below.
            var $btn = $(this);

            $btn.button('disable');
            $btn.prev('div').find('div.ui-input-btn').text('Please wait...'); // sets the text
            $btn.val('Please wait...'); // sets the text on the button itself
            clicked = true;

            setTimeout(function() { 
                $btn.button('enable'); 
                $btn.prev('a').find('span.ui-btn-text').text('click me');
                $btn.val('click me');
                clicked = false;
            }, 2000); 
        }
    });
});

Answer 1

首先，而不是

$(document).ready(function () {...

使用jQM页面事件，例如pagecreate：

$(document).on("pagecreate", "#pageid", function () {...

除此之外，更改按钮文本就像更新输入值然后在jQM按钮小部件上调用按钮（“刷新”）一样简单：

$btn.val('Please wait...').button('refresh');

全部放在一起：

$(document).on("pagecreate", "#page1", function () {

    var clicked = false;
    $('#wp-submit').on('click', function() {
        if(clicked == false) {
            var $btn = $(this);
            $btn.button('disable').val('Please wait...').button('refresh');
            clicked = true;

            setTimeout(function() { 
                $btn.button('enable').val('click me').button('refresh');
                clicked = false;
            }, 2000); 
        }
    });

});

正在使用 DEMO

这也适用于早期版本的jQM： DEMO 1.3

使用setTimeout函数

1 个答案: