ajax更新数据后,jquery、jq失效问题


Posted in Javascript onMarch 16, 2011

给元素绑定click事件 ,但是遇到一个问题 就是 当我执行一些ajax请求后 这个click事件就失效了

比如说 我的分页是一个ajax请求 但我点下一页时 后生成的元素a就没有了click事件了

其实 原因很简单

ajax加载内容是在$(document).ready()之后的操作,这个时候给绑定函数的时候,找到的元素集合中还不包括ajax加载的内容,所以原来的没有问题,后加载的就没有绑定

解决方法 有两个 :

1. 在ajax请求成功之后重新绑定
2. 用live方法

<script type="text/javascript"> 
<!-- 
jQuery(document).ready(function(){ 
jQuery(".brand li img").live('click',function(){ jQuery(this).parents("li").find("ul").slideToggle(); 
}); 
}); 
--> 
</script>

两种方法适用在不同的场合

如果是处理事件的话 可以用live
如果是其他一些处理方法的 live就不支持 只能重新绑定

Javascript 相关文章推荐
js下用gb2312编码解码实现方法
Dec 31 Javascript
背景图跟随鼠标移动的Mootools插件实现代码
Dec 12 Javascript
javascript的渐进增强与平稳退化浅谈
Nov 12 Javascript
Javascript玩转继承(三)
May 08 Javascript
JavaScript实现页面5秒后自动跳转的方法
Apr 16 Javascript
js实现跨域的4种实用方法原理分析
Oct 29 Javascript
简单理解vue中实例属性vm.$els
Dec 01 Javascript
详解angular2封装material2对话框组件
Mar 03 Javascript
CodeMirror js代码加亮使用总结
Mar 25 Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 Javascript
vue2.0 父组件给子组件传递数据的方法
Jan 15 Javascript
使用React手写一个对话框或模态框的方法示例
Apr 25 Javascript
初识JQuery 实例一(first)
Mar 16 #Javascript
扩展jquery实现客户端表格的分页、排序功能代码
Mar 16 #Javascript
基于Jquery的仿照flash放大图片效果代码
Mar 16 #Javascript
jQuery前台数据获取实现代码
Mar 16 #Javascript
最短的IE判断代码
Mar 13 #Javascript
javascript模拟的Ping效果代码 (Web Ping)
Mar 13 #Javascript
js中巧用cssText属性批量操作样式
Mar 13 #Javascript
You might like
第八节--访问方式
2006/11/16 PHP
PHP 自定义错误处理函数trigger_error()
2013/03/26 PHP
基于PHP常用函数的用法详解
2013/05/10 PHP
phpstudy默认不支持64位php的解决方法
2017/02/20 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
Jquery Autocomplete 结合asp.net使用要点
2010/10/29 Javascript
jquery ajax 同步异步的执行 return值不能取得的解决方案
2012/01/08 Javascript
jQuery+CSS 半开折叠效果原理及代码(自写)
2013/03/04 Javascript
jquery操作下拉列表、文本框、复选框、单选框集合(收藏)
2014/01/08 Javascript
JavaScript保存并运算页面中数字类型变量的写法
2015/07/06 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
2015/08/06 Javascript
jQuery网页选项卡插件rTabs用法实例分析
2015/08/26 Javascript
Bootstrap每天必学之弹出框(Popover)插件
2016/04/25 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
2016/06/23 Javascript
inner join 内联与left join 左联的实例代码
2017/09/18 Javascript
Angularjs cookie 操作实例详解
2017/09/27 Javascript
Linux Centos7.2下安装nodejs&amp;npm配置全局路径的教程
2018/05/15 NodeJs
Angularjs实现页面模板清除的方法
2018/07/20 Javascript
JavaScript数组基于交换的排序示例【冒泡排序】
2018/07/21 Javascript
云服务器部署Node.js项目的方法步骤(小白系列)
2020/03/23 Javascript
在vue中axios设置timeout超时的操作
2020/09/04 Javascript
[00:28]DOTA2北京网鱼队选拔赛
2015/04/08 DOTA
Python subprocess模块详细解读
2018/01/29 Python
selenium+python自动化测试之多窗口切换
2019/01/23 Python
解决Django中checkbox复选框的传值问题
2020/03/31 Python
python实现简单的tcp 文件下载
2020/09/16 Python
台湾母婴用品购物网站:Infant婴之房
2018/06/15 全球购物
Dower & Hall官网:英国小众轻奢珠宝品牌
2019/01/31 全球购物
安全教育心得体会
2013/12/29 职场文书
小学一年级学生评语
2014/04/22 职场文书
小学教师师德演讲稿
2014/05/06 职场文书
大雁塔导游词
2015/02/04 职场文书
2015年保洁工作总结范文
2015/04/28 职场文书
团支部组织委员竞选稿
2015/11/21 职场文书
《认识年月日》教学反思
2016/02/19 职场文书
JavaScript中时间格式化新思路toLocaleString()
2021/11/07 Javascript