我们会使用jQuery动态地生成许多子元素。
$("#canvas").append("<img id='oImg' class='z-index' src='imgURL'>");
//父元素#canvas添加子元素#oImg
但是我们同时希望为jQuery动态生成的子元素(#oImg)添加响应事件,这时候使用传统的方法,
$("#oImg").click(function(event){
....
...
});
往往会失败。事件无法得到响应。这时候需要使用jQuery中的 delegate()函数。
delegate() 方法
:为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。
语法
$(selector).delegate(childSelector,event,data,function):
参数
childSelector 必需。规定要附加事件处理程序的一个或多个子元素。
event 必需。规定附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。
data 可选。规定传递到函数的额外数据。
function 必需。规定当事件发生时运行的函数。
所以为动态生成的元素添加事件:
$("#canvas").delegate("#oImg","click",function(){
......
});