按钮交互loading ---- 转圈圈 加载


按钮loading状态自定义选项(功能)

可以在元素上添加 data-am-loading 来设置选项:

  • spinner 加载动画图标,适用于支持 CSS3 动画、非 input 元素,写图标名称即可;
  • loadingText 加载时显示的文字, 默认为 loading
  • resetText 重置以后的显示的文字,默认为原来的内容
    <button type="button" class="am-btn am-btn-primary btn-loading-example" data-am-loading="{spinner: 'circle-o-notch', loadingText: '加载中...', resetText: '加载过了'}">按钮 - button 元素</button>
    
    <input type="button" class="am-btn am-btn-secondary btn-loading-example" value="按钮 - input 元素" data-am-loading="{loadingText: '努力加载中...'}" />
    
    $('.btn-loading-example').click(function () {
      var $btn = $(this)
      $btn.button('loading');
        setTimeout(function(){
          $btn.button('reset');
      }, 5000);
    });

    拿来用即可,效果即现。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM