js的onclick和jquery的bind事件执行先后顺序
近期在项目中为每一个ajax触发按钮写正在加载的效果,用的是bootstarp
代码如下
$(function(){
$('.btn').bind('click',function(e){
var $btn = $(e.target)
if ($btn.attr("data-loading-text")){
$("#data-loading-control").ajaxStart(function(evt, request, settings){
$btn.button('loading');
});
$("#data-loading-control").ajaxComplete(function(evt, request, settings){
$(".btn").button('reset');
});
}
/*setTimeout(function(){
$btn.button('reset');
},1500);*/
});
});
在每一个按钮的点击事件中,判断该按钮是否存在
data-loading-control属性
例如
<button class="btn btn-primary" id="login-button" type="button" data-loading-text="正在登录">登录</button>
如果有的话就开始监听ajax的start事件和complete事件,并显示正在登陆,完成后重置按钮的状态
但是后来发现只有登录按钮可以正常,其他的按钮都不能显示正在执行的效果
唯一的区别就是,登录按钮的时间是写在jquery的bind中,而其他的按钮为了方便都是直接写了onclick 事件,网上说onclick事件先于bind事件执行,这样就能解释通了。
jquery在onclick事件中已经执行了ajax,然后才增加ajax的绑定监听,所以监听是无效的。
js的onclick和jquery的bind事件执行先后顺序的更多相关文章
- jquery中各个事件执行顺序如下:
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- JQuery 的Bind()事件
刚开始我们先看一下它的定义: .bind( eventType [, eventData], handler(eventObject)) .Bind()方法的主要功能是在向它绑定的对象上面提供一些事件 ...
- addEventListener、onclick和jquery的bind()、click()
addEventListener("click",function(event){},false); removeEventListener("click",f ...
- IE6/IE7/IE8 JQuery下resize事件执行多次的解决方法
在使用jQuery的resize事件时发现每次改变浏览器的窗口大小时resize时间会执行两次,百度搜索了一下找到一个解决的方法,使用setTimeout来解决这个问题代码如下: var resize ...
- jquery中bind事件时的命名空间用法(转)
场景:页面上的某个元素bind多个click事件处理函数,视用户的具体交互情况来决定到底使用哪个处理函数. 问题: unbind时会解绑所有的click事件,造成误伤.如果之前bind时有定义处理函数 ...
- jquery 自定义click事件执行多次
用jquery绑定一个按钮click事件后,第一次点击后一切正常,第二次点击竟然执行两次,以后越来越多, 后来查看文档发现 jquery click 不是替换原有的function 而是接着添加,所以 ...
- jquery ajax 事件执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- jquery ajax中事件的执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- jquery ajax事件执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
随机推荐
- Linux基础正则表达式:grep,sed
先说明语系对正则表达式的影响 LANG=C:0,1,2,3,4...A,B,C,D...Z a b c d ... z LANG=zh_CN:0,1,2,3,4...a A b B c C ...
- 【百度地图API】——国内首款团购网站的地图插件
原文:[百度地图API]--国内首款团购网站的地图插件 摘要: 本文介绍了一款应用在团购网站上的地图插件,适用于目前非常流行的团购网站.使用这款地图插件,无需任何编程技术,你就把商家的位置轻松地标注在 ...
- linux添加静态路由表,重新启动继续有效
在日常使用中.要么server于.有两个地址,两块网卡的配置,访问不同网段.这样的情况是非常普遍的现象.但,我们需要添加到路由表中的一个额外的,以确定通过正确的网关发送的数据包,并interface能 ...
- php设计模式(二):结构模式
上一篇我们介绍了设计模式的特性并且详细讲解了4种创建型模式,创建型模式是负责如何产生对象实例的,现在我们继续来给大家介绍结构型模式. 一.什么是结构型模式? 结构型模式是解析类和对象的内部结构和外部组 ...
- href 做导航 特效
<div> <div> <%for (int i = 0; i < 200; i++) { %><%=i.ToString() %> <br ...
- rpm安装FAQ
1.error: cannot create %sourcedir /usr/src/redhat/SOURCES错误的解决方案 显现error: cannot create %sourcedir / ...
- aspnet-webapi-2-contrib
https://github.com/rdingwall/protobuf-net-data https://github.com/mgravell/protobuf-net https://gith ...
- 初探Django Admin(一)
前面的文章记录了django项目的一些操作,插入数据部分是手动在shell中操作的,如果能有一个图形界面来管理我们的数据,那该多好~ Django已经想到大家会需要这个功能,通过简单的配置,就能使用d ...
- jQuery UI框架
jQuery UI框架 1.oschina开源社区-jQuery教程 2.jQuery PrimeUI(推荐) 3.弹出框.警告框.提示框.拖动支持.位置固定.选项卡切换 4.Bootstrap框架( ...
- outlook 会议室
原文:outlook 会议室 但是,里面的方法只能用于发送普通电子邮件.如果要发起会议之类的特殊邮件的话,可以C#调用Outlook API,自身的API. 创建项目后,为它添加.NET引用:“Mic ...