javascript - 完成后无法禁用引导按钮

Question

这很简单：在元素 el 上调用 bootstrap button('complete') 之后，

el.attr('disabled', 'disabled');​ 

和

el.addClass('disabled');​ 

没有效果

这是 jsfiddle http://jsfiddle.net/D2RLR/2732/

这就是我所期望的（它与“加载”一起使用的jsfiddle）：http: //jsfiddle.net/xgKZd/

Answer 1

这似乎只是一个时间问题：如果您在设置disabled类和属性之前“等待”，它会起作用：Demo (jsfiddle)

该插件使用 0 超时（查看源以获取更多信息），但它似乎“花费”了更多时间。只需添加一些延迟或自己制作按钮效果，以便您可以控制操作的顺序。

setTimeout(function() { $('#bton').button('complete'); }, 2000);

setTimeout(function() { $('#bton').attr('disabled', 'disabled').addClass('disabled'); }, 4000);

Answer 2

我遇到了同样的问题，想分享一个替代解决方案。您可以更改加载文本数据属性值。所以如果你有一个按钮：

<button id='myButton' data-loading-text="Loading..." type="submit">Save</button>

并且您最初做某事并想要显示“正在加载...”消息

$('#myButton').button('loading');

然后当你都完成后，你可以做这样的事情：

$('#myButton').data('loading-text','Done!').button('loading');

Answer 3

@Sherbrow 是对的，但您无需等待 2 秒即可禁用按钮。因为.button' 的 setState 方法正在使用 setTimeout （签出源代码）处理类，所以你只需要做类似的事情，例如：

var $btn = $('#btn');
$btn.button('complete');
setTimeout(function(){ 
    $btn.attr('disabled', 'disabled').addClass('disabled'); 
}, 0);