jquery中live()与click()方法的区别

项目中遇到需要动态生成 div 的控件，对这些 div 控件需要添加 click 事件，刚刚开始尝试如下：

$(".new_div").click(function(){
  		alert("test");
  		$(this).addClass("hightlight").children("div").show.end()
  		.siblings().removeClass("hightlignt").children("div").hide();	
  	});

结果并没有响应。后来查了一下资料：

1. live 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素)
2. click方法附加的事件处理程序适用于匹配选择器的当前元素

由于我添加的 div 元素是从服务器返回的数据动态加载生成的，通过上面的方法并不能给它绑定click 事件。修改如下：

$(".new_div").live('click',function(){
  		$(this).addClass("highlight").children("div").show().end()
  		.siblings().removeClass("highlignt").children("div").hide();	
  });

结果是可以的。最后尝试用live 绑定 toggle() 方法，代码如下：

 $(".new_div").live('click',function(){
  		$(this).toggle(function () {
  			$(this).addClass("highlight").children("div").show().end();
  			$(this).children("img").attr("src", "image/up.png");
  		},function () {
  			$(this).addClass("highlight").children("div").hide().end();
  			$(this).children("img").attr("src", "image/down.png");
  		});	
             $(this).trigger('click');});

注意：

$(this).trigger('click');

的作用在于，让绑定的click 立即生效，如果没加上这一句，那么第一次点击 div 是没有反应的。