jq绑定事件的方法

bind()支持Jquery所有版本；live()支持jquery1.8-；delegate()支持jquery1.4.2+；on()支持jquery1.7+ ，所以jq事件绑定可以直接都使用on来代替其他三种。

$(selector).on(event,childselector,data,function)

　　event：必需项；添加到元素的一个或多个事件，例如 click,dblclick等；

　　　　　　单事件处理：例如 $(selector).on("click",childselector,data,function);

　　　　　　多事件处理：1.利用空格分隔多事件，例如 $(selector).on("click dbclick mouseout",childseletor,data,function);

　　　　　　　　　　　　2.利用大括号灵活定义多事件，例如 $(selector).on({event1:function, event2:function, ...},childselector);　

　　空格相隔方式：绑定较为死板，不能给事件单独绑定函数,适合处理多个事件调用同一函数情况；大括号替代方式：绑定较为灵活，可以给事件单独绑定函数；　

　　childSelector: 可选；需要添加事件处理程序的元素，一般为selector的子元素；　　

　　data：可选；需要传递的参数；

　　function：必需；当绑定事件发生时，需要执行的函数

$(".container").on({drop:function(e){
	e.preventDefault();
    //jquery的file要去e.originalEvent里面拿
    var files = e.originalEvent.dataTransfer.files;
    console.log(files);
    alert(1)
}})

$(".container").on("drop",function(e){
	e.preventDefault();
    //jquery的file要去e.originalEvent里面拿
    var files = e.originalEvent.dataTransfer.files;
    console.log(files);
    alert(1)
})

以上方式只能给页面已有元素绑定事件，如果给未来添加进来的元素绑定事件，比如给p绑定事件，用

$(".container").on("drop","p",function(e){
	e.preventDefault();
    //jquery的file要去e.originalEvent里面拿
    var files = e.originalEvent.dataTransfer.files;
    console.log(files);
    alert(1)
})

jq绑定事件的方法

猜你喜欢