按钮插件--按钮加载状态，玩转Bootstrap（JS插件篇）教程-慕课网

按钮插件--按钮加载状态

通过按钮可以设计状态提示，当单击按钮时，会显示loading状态信息。例如，点击“加载”按钮，会触发按钮的加载的状态。如下所示：

<button class="btnbtn-primary" data-loading-text="正在加载中,请稍等..." type="button" id="loaddingBtn">加载</button>

通过data-loading-text属性定义加载的文本信息，然后通过JavaScript给按钮绑定一个事件，并给按钮添加一个button("loading")方法来激活按钮的加载状态行为。如下所示：

$(function(){
    $("#loaddingBtn").click(function () {
        $(this).button("loading");
      });
});

运行效果如下：

点击前：

点击后：

注意，无法直接通过声明式触发此效果。

?不会了怎么办

<script>
      $(function(){
         $("#loaddingBtn").click(function () {
           $(this).button("loading");
         });
      });
</script>

提交

公开笔记

提交

全屏

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求