对于js使用append追加的节点无法添加事件的解决方法
2016-10-13 11:29
633 查看
有的时候我们为了体验性和灵活性,会使用js或者jQuery异步获取数据使用append方法追加元素,但是相对以前静态页面写的事件在新追加的元素上面不管用,就算在新追加的标签里面直接添加onclick事件也不起效果
for(var i=0;i<=p_arr.length-1;i++) { <span style="white-space:pre"> </span>province_html += '<li onclick="select_pro()"><span class="ml10">'+p_arr[i]['area_name']+'</span></li>'; } $("#search-sort-list").append(province_html); $('#search-sort-list li').click(function()
{ <span style="white-space:pre"> </span>alert(111);//弹不出来 })
原因是因为新追加的元素节点不会帮定click事件。
解决方法:
使用on方法<pre name="code" class="javascript">$('#search-sort-list').on('click','li',function()
{ <span style="white-space:pre"> </span>alert(111); })就可以了
相关文章推荐
- 解决使用jQuery采用append添加的元素事件无效的方法
- 解决使用jQuery采用append添加的元素事件无效的方法
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
- 解决jQuery使用append添加的元素事件无效的方法
- js 添加事件 attachEvent和addEventListener 使用方法
- 解决TextBox中, JS方法(DatePicker)改变Text内容后, 无法触发OnTextChanged事件的问题
- asp.net updatepanel 导致JS不能加载,而无法使用的解决方法
- IE 无法使用 js trim() 的解决方法
- Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法
- Web app 前端框架ratchet使用push.js界面跳转后,js代码无法执行的解决方法
- ruby应用里添加zepto.min.js但是无法使用里面的方法
- 解决IE8 无法使用 JS 中Array() 的 indexOf 方法
- 使用js的ajax方法读取txt文本里面的JSON数据并追加到Html元素节点上
- GridView中RowDataBound事件无法使用隐藏列的解决方法
- 解决jquery中动态新增的元素节点无法触发事件问题的两种方法
- Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法
- 对于image.fromfile方法在使用时,遇到的“正由另一进程使用,因此该进程无法访问此文件”解决方法
- IE 无法使用 js trim() 的解决方法
- vc6.0无法使用“添加到工程”或者"打开文件"解决方法
- 解决jquery中动态新增的元素节点无法触发事件问题的两种方法