按钮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);
    });

    拿来用即可,效果即现。

按钮交互loading ---- 转圈圈 加载的更多相关文章

  1. jquery mobile 的loading提示“正在加载...”在不同版本中的不同实现方式

    在jquery mobile开发中,在页面的切换.或者ajax获取数据时由于网速慢等其他原因,会有一个加载的时间,如果能在这段时间给一个“正在加载...”的提示,用户体验会更好.下面来简单的介绍一下在 ...

  2. 页面数据加载完成时,显示loading页面.数据加载完,loading隐藏.

    一,引入三个文件 jQuery版本使用 jQuery v1.7.1 jquery-easyui文件中,引入easyui-lang-zh_CN.js的js 做数据加载时使用jquery.blockui. ...

  3. Entity Framework加载相关实体——延迟加载Lazy Loading、贪婪加载Eager Loading、显示加载Explicit Loading

    Entity Framework提供了三种加载相关实体的方法:Lazy Loading,Eager Loading和Explicit Loading.首先我们先来看一下MSDN对三种加载实体方法的定义 ...

  4. 在页面加载前先出现加载loading,页面加载完成之后再显示页面

    在此加入一个关于页面加载成功之前先展现一个loading的案例: 如下代码写入js里放在html头部即可实现需求:添加的可以自己在css文件设置宽高,也可以放入一个background的gif的loa ...

  5. 【iOS和HTML 5交互】iOS中加载html5调用html方法和修改html5内容

    近期项目开发中用到了这方面的技术了,那我们一起来看看. 1.利用webView控件加载本地html5或者网络上html5 2.设置控制器为webView的代理,遵守协议 3.实现代理方法webView ...

  6. cocos2dx loading界面 预加载资源 与 资源释放

    预加载图片: 1.CCTextureCache::sharedTextureCache()->addImage("icon.png"); 2.CCTextureCache:: ...

  7. 旋转加载loading和点点加载loadingdemo

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 【WPF学习笔记】之如何点击“新建”按钮,在面板中加载一条条的“用户控件”的信息:动画系列之(四)

    ...... 承接上一系列动画三. 在主界面后台代码设置嵌套第二个用户控件. using System; using System.Collections.Generic; using System. ...

  9. CSS3 Loading进度条加载动画特效

    在线演示 本地下载

随机推荐

  1. mongo 介绍

    [介绍]:MongoDB 是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统.在高负载的情况下,添加更多的节点,可以保证服务器性能.MongoDB 旨在为WEB应用提供可扩展的高性能数据存 ...

  2. java 给多人发送、抄送

    关键技术: 1.MimeMessage的setRecipients方法设置邮件的收件人,其中Message.RecipientType.TO常量表示收件人类型是邮件接收者,Message.Recipi ...

  3. href=http:// href=// 的区别,src=http:// src=// 的区别。 链接里不带http,链接里直接使用双斜线 // 有什么不同。http://和//有什么区别?

    其实很简单,当一个连接用双斜线 // 开头时表示如果浏览器当前使用的是https协议,那么就加载https协议的脚本,否则使用http,这保证了页面所有资源使用同一协议. 其实是有人将其做为规范来实践 ...

  4. 源码编译mysql 5.5+ 安装过程全记录

    前言:从mysql 5.5版本开始,mysql源码安装开始使用cmake了,编译安装跟以前的版本有点不一样了. 一,安装步骤: 1.安装前准备工作 a.下载mysql源代码包,到mysql下载页面选择 ...

  5. 3行代码 多元线性方程组 rank=4 多元-一元 降元

    对于线性方程组Ax=b 对A和b执行同样的一串行初等运算, 那么该方程组的解集不发生变化. [未知-已知   高阶--低阶] http://mathworld.wolfram.com/CramersR ...

  6. 点聚-weboffice 6.0 (三)

    1.页面 var filename="<%=request.getParameter("filePath").toString()%>"; docu ...

  7. 高德地图API开发二三事(一)如何判断点是否在折线上及引申思考

    最近使用高德地图 JavaScript API 开发地图应用,提炼了不少心得,故写点博文,做个系列总结一下,希望能帮助到LBS开发同胞们. 项目客户端使用高德地图 JavaScript API,主要业 ...

  8. SIFT算法详解(转)

    原文地址 http://blog.csdn.net/pi9nc/article/details/23302075 尺度不变特征变换匹配算法详解 Scale Invariant Feature Tran ...

  9. weblogic开启远程访问的jmx设置

    通过jmx远程访问weblogic获取监控jvm的数据,要在weblogic启动的时候设置一些配置,具体如下: 在weblogic的安装目录:{weblogic_home}/wlserver_10.3 ...

  10. 友盟分享到微信的几点备忘(IOS)

    1.下载最新的友盟分享版本,参考友盟官方的demo 2.注册微信开放平台用户,不是公众平台,注册应用 3.参考文档和demo,加入sdk包和相应的lib 4.在plist加入URL types.URL ...