Javascript 引导3的Ladda UI不工作？请查看我的代码并告诉我修复方法_Javascript_Jquery_Html_Css_Twitter Bootstrap 3

Javascript 引导3的Ladda UI不工作？请查看我的代码并告诉我修复方法

javascript jquery html css twitter-bootstrap-3

Javascript 引导3的Ladda UI不工作？请查看我的代码并告诉我修复方法,javascript,jquery,html,css,twitter-bootstrap-3,Javascript,Jquery,Html,Css,Twitter Bootstrap 3,引导3的Ladda UI不工作？请查看我的代码并告诉我修复方法。下面是我的代码 <link href="~/Content/bootstrap.css" rel="stylesheet" /> <link href="~/Content/ladda-themeless.css" rel="stylesheet" /> <link href="~/Content/prism.css" rel="stylesheet" /> <link href="~/C

引导3的Ladda UI不工作？请查看我的代码并告诉我修复方法。下面是我的代码

<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Content/ladda-themeless.css" rel="stylesheet" />
<link href="~/Content/prism.css" rel="stylesheet" />
<link href="~/Content/ladda.min.css" rel="stylesheet" />
<link href="~/Content/bootstrap.css" rel="stylesheet" />    
<script src="~/Scripts/jquery-1.11.2.js"></script>
<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
<script src="~/Scripts/ladda.js"></script>
<script src="~/Scripts/ladda.jquery.js"></script>
<script src="~/Scripts/prism.js"></script>
<script src="~/Scripts/spin.js"></script>
<h2>Test Page</h2>
<body>
    <button class="btn btn-primary ladda-button" data-style="expand-left"><span class="ladda-label">expand-left</span></button>
</body>


测试页
向左展开

现在按钮出现在屏幕上，但点击按钮什么也并没有发生，但我期待一个旋转跨度接近按钮文本。

请参见此处：

在结束标记之前包含这些脚本引用确保它们排列整齐

您缺少脚本部分中的

Ladda.bind

。将其添加到

中，则用于引导的Ladda应该可以工作示例代码：

<script src="~/Scripts/jquery-1.11.2.js"></script>
<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
<script src="~/Scripts/ladda.js"></script>
<script src="~/Scripts/ladda.jquery.js"></script>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>


 <script type="text/javascript" src="js/prism.js"></script>



     <script>
                ///your are missing this part 
                // Bind normal buttons
                Ladda.bind( 'div:not(.progress-demo) button', { timeout: 2000 } );
                // Bind progress buttons and simulate loading progress
                Ladda.bind( '.progress-demo button', {
                    callback: function( instance ) {
                        var progress = 0;
                        var interval = setInterval( function() {
                            progress = Math.min( progress + Math.random() * 0.1, 1 );
                            instance.setProgress( progress );
                            if( progress === 1 ) {
                                instance.stop();
                                clearInterval( interval );
                            }
                        }, 200 );
                    }
                } );
                // You can control loading explicitly using the JavaScript API
                // as outlined below:

            </script>


///你缺少这一部分
//绑定普通按钮
bind（'div:not（.progress-demo）按钮'，{timeout:2000}）；
//绑定进度按钮并模拟加载进度
绑定（“.progress演示按钮”{
回调：函数（实例）{
var进程=0；
var interval=setInterval（函数（）{
progress=Math.min（progress+Math.random（）*0.1,1）；
实例.setProgress（progress）；
如果（进度===1）{
instance.stop（）；
间隔时间；
}
}, 200 );
}
} );
//您可以使用JavaScript API显式控制加载
//如下所述：