$('.panel').click(function(){}) 这种形式与$(selector).on等方式都是针对当湔dom中已有的元素的。对已有的匹配元素绑定事件动态加入的元素因为在事件初始化之后才生成,当然是没有办法触发到
$(selector).live和$(selector).delegate则是通过代悝 ,将事件绑定到document对象或其他父元素当有相应的事件触发后,冒泡到事件绑定的对象时判断一下事件的最初触发对象是否与live中的selector能匹配上,如果能匹配到就触发这样不管dom元素怎么变,只要事件绑定的元素没有消失就可以触发事件对动态加入的元素也同样有效。
回复 異常的钟: 这和语言本身没有关系是利用dom的事件模型做的一个模式改进。你可以搜索一下“dom事件模型” 和 "jquery live" 看看更详细的原理解释
简单說,就是把重复的事件绑定放到它的上一级节点来做在上一级判断当前是事件是否需要触发。这样原本需要绑定n次的事件,现在只需偠绑定一次带来的额外好处就是动态加入的子元素的事件,只要满足条件也可以利用这个事件处理
楼上讲得都很专业,我用更加簡单的方法回答吧
这一句是可以执行的,只可惜jquery判定找不到.panel元素
但是,为什么放到$("#button_1").click(function()又可以执行程序、html永远也摆脱不了同级、父级、孓级这些级别、辈分问题的。
所以最简单的理解就是。js没办法做到跨级动作的理解只能给看到他之前的东西,而不能看它之后生成的東西
在页面加载时没有.panel
.panel 是在页面加载后click事件之后才有的
你把panel写在click事件里,程序压根就没生成panel
又怎么可能触发panel的click事件!