这篇文章主要为大家解决下为什么jQuery绑定事件不执行而alert后可以正常执行,需要的朋友可以参考下
因为我不知道怎么描述这个问题,故标题起的这么坑爹

主要过程是这样的,今天我写一个类似于百度知道那样有提问答案的页面,所有的数据都是页面第一次加载时通过ajax得到的
 
希望实现的效果是提问者可以通过店家每个答案后面的星星符号选择采纳此答案,被采纳的答案星星图标会变成全黑的。

开始我是这样写的
 
$('.choose_right_answer').bind('click',function(){
if(currentUser==questioner) {
if ($(this).attr("src") == "img/star_fav_empty.png")
$(this).attr("src", "img/star_fav.png");
else
$(this).attr("src", "img/star_fav_empty.png");
}
});

.choose_right_answer是每个星星class名

运行之后点击星星没有反应

于是我在上面所示代码段之前加上了一个alert("test")

此时加载页面后弹出对话框test之后,星星图标上绑定的事件可以正常执行。

上网搜了一通答案,得到的结果是由于所有的这些答案的节点都是动态生成的,因此可能在这些节点还没有执行完时,就执行了事件绑定,以至于并没有真正将事件绑定到生成的这些答案的节点。

而加上alert之后,可以明显看到,alert语句在所有数据得到后才执行,确保了事件绑定在数据加载完之后执行,因此事件成功绑定到了各个回答上。
http://img.blog.csdn.net/20140531202827265
解决方法,使用jQuery中的on来绑定事件
 
$("#answer_wrap").on('click','.choose_right_answer',function(){
if(currentUser==questioner) {
if ($(this).attr("src") == "img/star_fav_empty.png")
$(this).attr("src", "img/star_fav.png");
else
$(this).attr("src", "img/star_fav_empty.png");
}
});

answer_wrap是所有回答所在块的id

所有在这个块里class为choose_right_answer的元素如果发生点击则事件冒泡到answer_wrap,执行对应函数,其余在这个块中的元素发生点击事件则忽略

这样就可以解决动态加载数据中事件绑定的问题
最新资讯
媒体会挤满滴滴高管 顺风车依旧无上线时间表

媒体会挤满滴滴高管

但即使做了这么多有关安全的调整,包括柳青在内的滴滴高
小鹏汽车连发补救措施挽人心

小鹏汽车连发补救措施

小鹏汽车正在制定新的补偿方案,包括三年6折保值换购或
亚马逊败走 图书电商巨头四进三

亚马逊败走 图书电商

用户增长的红利正逐渐消失。为了能够稳定自身的业务规
滴滴取消顺风车附近接单

滴滴取消顺风车附近接

未来将在白天试运行顺风车,并在试运行期间免收车主信息
北京ETC卡不必担心被盗刷

北京ETC卡不必担心被

北京地区近几年发行的ETC速通卡并不具有金融功能,只能
欧盟批准220亿美元收购 沃达丰成欧洲最大综合运营商

欧盟批准220亿美元收

去年5月,沃达丰宣布将收购Liberty Global的德国和中欧
最新文章
Javascript读写cookie的实例源码

Javascript读写cookie

今天小编就为大家分享一篇关于Javascript读写cookie的
微信小程序登录session的使用

微信小程序登录sessio

这篇文章主要介绍了微信小程序登录session的使用,小编
JavaScript中this用法学习笔记

JavaScript中this用法

在本篇文章里小编给大家分享了关于JavaScript中this用
nodejs微信开发之授权登录+获取用户信息

nodejs微信开发之授权

这篇文章主要介绍了nodejs微信开发之授权登录+获取用
nodejs微信开发之自动回复的实现

nodejs微信开发之自动

这篇文章主要介绍了nodejs微信开发之自动回复的实现,文
node微信开发之获取access_token+自定义菜单

node微信开发之获取ac

这篇文章主要介绍了node微信开发之获取access_token+