jquery 动态增加的html元素,初始化设置在id或class上的事件无效

一般情况,我们会在页面初始化完成后对class定义一些全局事件,举个栗子:

$(document).ready(function(){
    $(".class").on("mouseover",function(e){
      alert("鼠标经过了");
    });
});

正常情况下,这样的写法是正确的。可是往往当我们需要通过jquery动态的添加一些html元素到界面时,会发现定义的全局方法对新增元素无效了,举个栗子:

function addDom(){
   $("#abc").append("<div class='class'></div>");
}

以前处理的方案是初始化事件时使用live,栗如:

$(".class").live("mouseover",function(){
  alert("鼠标经过了");
});

今天使用jquery 1.10.2时居然提示live关键字无效,百度一下,原来在新版本的jquery中去掉了live关键字,新的写法如下:

$(document).ready(function(){
	$(document).on("mouseover",".class",function(e){
		alert("鼠标经过了");
	});
}

至此,完美解决。

posted @ 2016-09-20 13:45  馨语随风  阅读(5933)  评论(0编辑  收藏  举报