twitter-bootstrap 引导数据加载文本不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21568743/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap data loading text not working
提问by Ryan Salmons
I am trying to create a twitter bootstrap button that changes to 'Loading...' when selected until the javascript loads. However I cannot get it to work...
我正在尝试创建一个 twitter bootstrap 按钮，该按钮在选择时更改为“正在加载...”，直到 javascript 加载。但是我无法让它工作......
Here is my html:
这是我的 html：
<button type="submit" id="sign-up" data-loading-text="Processing..." class="btn btn-sign-up">SIGN UP</button>
Javascript:
Javascript：
<script>
$('#sign-up').click(function () {
var btn = $(this);
btn.button('loading');
$.ajax(...).always(function () {
btn.button('reset');
});
});
</script>
回答by Ismael Sarmento
As you're using jQuery and bootstrap, you can follow this example on http://jsfiddle.net/liuyl/RdpRw/1/
当您使用 jQuery 和引导程序时，您可以在http://jsfiddle.net/liuyl/RdpRw/1/上按照此示例进行操作
$('button[data-loading-text]')
.on('click', function () {
var btn = $(this)
btn.button('loading')
setTimeout(function () {
btn.button('reset')
}, 3000)
});
OBS: see the full sample on the link. Notice the external libraries on the left menu on jsfiddle, you can't forget to reference them.
OBS：请参阅链接上的完整示例。请注意 jsfiddle 左侧菜单中的外部库，您不能忘记引用它们。
回答by Jermain Luong
Not sure if you've already solved your problem. You should place you script inside $(document).ready() callback so that the $("#sign-up") is available when the click event is registered
不确定你是否已经解决了你的问题。您应该将脚本放在 $(document).ready() 回调中，以便在注册点击事件时 $("#sign-up") 可用
$(document).ready(function() {
$('#sign-up').click(function () {
var btn = $(this);
btn.button('loading');
$.ajax(...).always(function () {
btn.button('reset');
});
});
});
Let's try the updated code here http://jsbin.com/pamujimise/edit?html,output
让我们在这里尝试更新的代码 http://jsbin.com/pamujimise/edit?html,output
