引导加载按钮状态不起作用

Question

我希望我的按钮根据boostrap文档http://getbootstrap.com/javascript/#buttons更改为加载状态

为什么我的按钮在这里没有变为加载状态？

<!DOCTYPE html>
<HTML>
<HEAD>
    <TITLE>Bootstrap Example</TITLE>
    <link type="text/css" rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css ">
<STYLE>
</STYLE>
</HEAD>
<BODY>
    <button type="button" class="btn btn-primary" id="btnD" data-loading-text="=)">hola!!!</button>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="http://twitter.github.com/bootstrap/assets/js/bootstrap.js "></script>
    <script type="text/javascript">
        $(function(){
            $('#btnD').click(function(){
                  var btn = $(this); 
                  btn.button('loading');
            });
        });
    </script>
</BODY>
</HTML>

Answer 1

引导网址不正确，未加载JS或CSS。 这些将起作用：

<!DOCTYPE html>
<HTML>
<HEAD>
    <TITLE>Bootstrap Example</TITLE>
    <link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<STYLE>
</STYLE>
</HEAD>
<BODY>
    <button type="button" class="btn btn-primary" id="btnD" data-loading-text=":)">hola!!!</button>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(function(){
            $('#btnD').click(function(){
                  var btn = $(this); 
                  btn.button('loading');
            });
        });
    </script>
</BODY>
</HTML>

按钮的外观也应更改。

Answer 2

我建议您在计算机中下载bootstrap css和js文件。 当引导css和js文件被内联放置或链接到放置在客户端计算机中的css和js文件时，它可以正常工作。 Bootstrap css和js Urls无效。 在此处下载Bootstrap CSS和JS文件

引导加载按钮状态不起作用

问题描述

2 个解决方案

解决方案1
3 已采纳 2015-05-05 10:54:40

解决方案2
1 2015-05-05 11:20:58

引导加载按钮状态不起作用

问题描述

2 个解决方案

解决方案1 3 已采纳 2015-05-05 10:54:40

解决方案2 1 2015-05-05 11:20:58

解决方案1
3 已采纳 2015-05-05 10:54:40

解决方案2
1 2015-05-05 11:20:58