意外解决js动态生成的html代码中一些事件失效问题
2015-10-29 15:40
731 查看
做一个页面功能,用ajax实现查看更多的效果。当用户浏览到最后,点击查看更多再追加一页的数据到最后。
当然是用javascript更改html内容,把一页的数据html追加到后面。然后追加的代码中有一个class属性,这个属性将由一段javascript代码控制显示与否。可是追加出来的数据却没有这个效果。通过F12查看生成的HTML代码,与有效果的无异。查找资料知道产生这个问题的原因是由于HTML都是页面首次加载生成的,javascript也是页面初次加载进来的。而通过点击事件动态追加的HTML代码可能不受影响。在纠结之后,突然想到,从javascript中找到根据class属性控制的代码,COPY一份放到追加HTML代码的后面。也就是说,每次追加更多内容以后,再重新定义一次js事件。刷新页面,测试,效果有了!!!!
谨以此文,码下,以饷后人
当然是用javascript更改html内容,把一页的数据html追加到后面。然后追加的代码中有一个class属性,这个属性将由一段javascript代码控制显示与否。可是追加出来的数据却没有这个效果。通过F12查看生成的HTML代码,与有效果的无异。查找资料知道产生这个问题的原因是由于HTML都是页面首次加载生成的,javascript也是页面初次加载进来的。而通过点击事件动态追加的HTML代码可能不受影响。在纠结之后,突然想到,从javascript中找到根据class属性控制的代码,COPY一份放到追加HTML代码的后面。也就是说,每次追加更多内容以后,再重新定义一次js事件。刷新页面,测试,效果有了!!!!
谨以此文,码下,以饷后人
相关文章推荐
- js计算日期的相关函数
- js实现跨域的4种实用方法原理分析
- 掌握JS中的“this” (二)
- 什么是json以及json解析
- 银行卡号4位分隔JS
- JavaScript面向对象
- js原生拓展网址——mozilla开发者
- 异步JS框架的作用以及实现方法
- JavaScript操作Cookie笔记
- 图解JSP与Servlet的关系
- 掌握JS中的“this” (一)
- Javascript浮点数运算及比较代码收集整理
- javascript笔记之------Function
- js 获取页面高度和宽度(兼容 ie firefox chrome),获取鼠标点击位置
- 各种JS验证和操作
- js中返回含js代码问题(<script></script>)
- JavaScript如何处理可变参数
- 图解JavaScript中的this关键字
- 错误整理(一)使用 JSTL 标签出现警告
- Oozie安装ExtJs教程