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)
})