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

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

未捕获的ReferenceError：$未定义

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

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

Answer 2

在对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/

bootstrap按钮加载状态

2 个答案: