在使用原生写页面的时候我们会发现啊动态渲染页面元素的时候他的事件会失效，那时因为动态渲染的过生往往在你给元素添加事件绑定的js之后执行。
原本是这样写点击和鼠标事件的
$('.textBox .text').on('mouseover',function(){
swiper.stopAutoplay();
let name=$(this).parent().parent().find('.name').text().replace(/\s*/g,"")
rightData.forEach((item,index)=>{
if(item.name==name){
}
})
})
$('.textBox .text').on('mouseout',function(){
swiper.startAutoplay();
})
//点击
$('.text').click(function(){
})当点击事件失效的时候我们可以使用on去代替
//点击
$('.text').on('click',function(){
})当on还是不行的时候我们可以使用jquery— delegate() 方法去实现
定义和用法
delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。
使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）
语法
$(selector).delegate(childSelector,event,data,function)
| 参数 | 描述 |
|---|---|
| childSelector | 必需。规定要附加事件处理程序的一个或多个子元素。 |
| event |
必需。规定附加到元素的一个或多个事件。 由空格分隔多个事件值。必须是有效的事件。 |
| data | 可选。规定传递到函数的额外数据。 |
| function | 必需。规定当事件发生时运行的函数。 |
这时候的写法为：
$('body'). delegate('.textBox .text','mouseover',function(){
swiper.stopAutoplay();
let name=$(this).parent().parent().find('.name').text().replace(/\s*/g,"")
rightData.forEach((item,index)=>{
if(item.name==name){
}
})
})
$('body'). delegate('.textBox .text','mouseout',function(){
swiper.startAutoplay();
})
$('.test').delegate('click',functon(){
})版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/79797.html
