js-dom装载后异步写入的内容,无法绑定到事件
2017-02-24 23:04
260 查看
页面事件绑定是在dom装载时,后期用js另写入的内容,无法绑定到事件。
解决方案: 将事件委托到父元素(未动态更改的元素),等事件冒泡到父元素上面再进行事件处理。
如:
此时,若想直接在<li>元素上定义事件是无效的。
正确绑定方式:
解决方案: 将事件委托到父元素(未动态更改的元素),等事件冒泡到父元素上面再进行事件处理。
如:
// 后期在js中动态append html元素 for(var i=0; i<5; i++){ $(".chiefRace_select ul").append("<li keyvalue='aaa'>bbb</li>"); }
此时,若想直接在<li>元素上定义事件是无效的。
正确绑定方式:
$(".chiefRace_select ul").on("click", "li", function(){ alert("clicked <li>"); })
相关文章推荐
- js中的事件委托机制(解决动态生成的dom元素无法绑定事件的问题)
- JS中dom绑定事件方法
- 【JS 设计模式 】门面模式之DOM元素绑定事件
- js HTML DOM事件绑定
- JS实现对DOM元素事件的绑定
- 01 JS-DOM之--事件以及绑定方法
- js给dom元素绑定事件的三种方式
- js---JavaScript中的事件委托/事件代理,如何通过事件委托进行异步DOM事件监听
- js 动态dom绑定事件
- Visual Event :快速查看 DOM 上绑定的 JS 事件
- js循环给li绑定事件实现 点击li弹出其索引值 和内容
- 【js】【事件驱动】【Dom元素节对象点绑定事件的3种方式】
- 解决TextBox中, JS方法(DatePicker)改变Text内容后, 无法触发OnTextChanged事件的问题
- js调试工具查看dom元素上绑定的事件列表
- js循环给li绑定事件实现 点击li弹出其索引值 和内容
- HTML中关于动态创建的标签无法绑定js事件的解决方法
- ajax返回的html内容绑定不了js事件
- js动态生成的DOM绑定事件失效的问题
- 如何用vue 语法 给html元素绑定原生js DOM 事件
- js动态生成的dom无法启动事件(click,mouseover......)