jquery - 重置后，jQuery attr()在Bootstrap按钮上不起作用

我有一个非常简单的代码，它无法正常工作，而且我不明白自己所缺少的内容。

外部资源

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>

的HTML

<p>
    <button id="btn-id" class="btn btn-large btn-primary" type="button" data-loading-text="loading stuff...">Click Me</button>
</p>

的JavaScript

$(document).ready(function () {
    $("#btn-id").button();

    $("#btn-id").click(function () {
        //$("#btn-id").attr("disabled",true);
        $(this).button('loading');

        setTimeout(function () {
            //this desn't work. The button resets but it doesn't get disabled afterwards
            $("#btn-id").button('reset').attr("disabled", true);

            //the bellow line works as expected
            //$("#btn-id").button('reset').addClass("btn-success");
        }, 2000);
    });
});

看来在button('reset')之后，我可以addClass('someclass')了，但是我不能再禁用该按钮了。

为什么这不起作用，我该如何解决？

jsFiddle

最佳答案

不知道这是否是正确的方法，但是您可以使用一种解决方法

$(document).ready(function () {
    $("#btn-id").button();

    $("#btn-id").click(function () {
        $(this).button('loading');
        setTimeout(function () {
            $("#btn-id").addClass('btn-success').data('loading-text', 'OK').button('loading')
        }, 2000);
    });
});

FIDDLE

关于jquery - 重置后，jQuery attr()在Bootstrap按钮上不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17968611/