javascript - 引导按钮加载状态

Question

我正在尝试这样做，以便当有人单击按钮时，它会从普通按钮变为切换按钮，文本更改为加载中...

所以我包括了这个按钮

<button type="button" id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
    Loading state
</button>

但是当我单击按钮时没有任何反应。

我也有这个在身体的底部。

<script>
        $(function() {
          var btn = $('#fat-btn').click(function () {
            btn.button('loading')
            setTimeout(function () {
              btn.button('reset')
            }, 3000)
          })
        })
</script>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>

这是我试图包含按钮的网站（位于屏幕底部） http://www.ticketmachine.x10.mx/

Answer 1

一旦你对你的 jQuery 问题进行了排序，你应该click如下更新你的函数：

$(function(){
    var $btn = $('#fat-btn');
    $btn.click(function(){
        var $this = $(this);
        $this.attr('disabled', 'disabled').html("Loading...");
        setTimeout(function () {
            $this.removeAttr('disabled').html('Hello');
        }, 3000)
    });
})

小提琴：http: //jsfiddle.net/RJDgG/1/

Answer 2

我访问了您提供的链接。我打开了firebug，它记录了下面给出的JS错误。

未捕获的 ReferenceError：$ 未定义

您编写了一些使用 jQuery 的 JavaScript，但它是在包含 jQuery 库之前添加的。

您应该在 jQuery 链接之后移动脚本标签。