bootstrap改变按钮加载状态

 更新时间:2014年12月01日 16:46:39   投稿:hebedich  
这篇文章主要介绍了bootstrap改变按钮加载状态的方法,需要的朋友可以参考下

bootstrap里面有个激活按钮的时候,按钮变成不可用的;

按照官网里面的方法介绍是在button按钮加个 data-loading-text="Loading..." 属性,然后js总体代码是这样:

复制代码 代码如下:

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

<script>
  $('#myButton').on('click', function () {
    var $btn = $(this).button('loading')
    // business logic...
    $btn.button('reset')
  })
</script>

其中autocomplete="off"属性是针对FF浏览器在页面加载之后,禁用状态不会自动解除用的。
我在直接用上面代码的时候,发现loading状态是没有的。
然后我自己改了一下,写成这样,就OK了

复制代码 代码如下:

<script>
//用于微笑话登陆按钮以及审稿按钮改变按钮加载状态
    function loag() {
      var btn = $("#btn_login");
      btn.button('loading');
      setTimeout(function () { btn.button('reset'); },2000);
    }
</script>
 <button type="button" class="btn btn-default" data-loading-text="Loading..." autocomplete="off" onclick="loag()" id="btn_login">登陆</button>

稍作就改就可以实现我们的要求了,不知道官方这块是不是没有测试就放上来了,这里把解决方案推荐给小伙伴。

相关文章

  • 谈谈对offsetleft兼容性的理解

    谈谈对offsetleft兼容性的理解

    offsetleft属性具有一定的兼容性问题,在IE7浏览器中,它的返回值是相对于最近的父类元素的左侧的距离,本文通过代码示例给大家介绍offsetleft兼容性问题,小伙伴们一起看看吧
    2015-11-11
  • layui动态绑定事件的方法

    layui动态绑定事件的方法

    今天小编就为大家分享一篇layui动态绑定事件的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 通用无限极下拉菜单的实现代码

    通用无限极下拉菜单的实现代码

    下面小编就为大家带来一篇通用无限极下拉菜单的实现代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • 最丑的时钟效果!js canvas时钟制作方法

    最丑的时钟效果!js canvas时钟制作方法

    最丑的时钟效果,这篇文章主要为大家详细介绍了js canvas时钟制作方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • 初识javascript 文档碎片

    初识javascript 文档碎片

    今天遇到一个问题: 我通过 ajax 取回另一个页面的 Html 。但这些 HTML 我不想直接输出,想通过 getElementsByName 处理后再输出相应的内容。用原生的 javascript怎样可以处理呢?
    2010-07-07
  • js如何获取object类型里的键值

    js如何获取object类型里的键值

    这篇文章主要介绍了js获取object类型里键值的方法,需要的朋友可以参考下
    2014-02-02
  • KnockoutJS数组比较算法实例详解

    KnockoutJS数组比较算法实例详解

    这篇文章主要介绍了KnockoutJS数组比较算法实例详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-11-11
  • javascript多种数据类型表格排序代码分析

    javascript多种数据类型表格排序代码分析

    这个表格排序代码,性能比上一次那一个好了很多而且支持很多种类型的排序,这一次写的能支持更多的排序。
    2010-09-09
  • 浅谈javascript中的Function和Arguments

    浅谈javascript中的Function和Arguments

    下面小编就为大家带来一篇浅谈javascript中的Function和Arguments。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • JavaScript实现在页面间传值的方法

    JavaScript实现在页面间传值的方法

    这篇文章主要介绍了JavaScript实现在页面间传值的方法,涉及javascript传值的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04

最新评论