1.普通事件绑定
$("#btn").on("click",function(){
console.log("我被点击了")
})
给事件添加命名空间
$("#btn").on("click.myClick",function(){
console.log("我被点击了")
})
// .myClick 就是添加的命名空间，用来标识本次事件，删除事件的时候方便指定
$("#btn").off("click.myClick") // 仅仅解绑了上面的那个事件
2.事件代理
$("ul").on("click", "li", function(){
var text = $(this).text()
console.log(text)
})
3.可以在绑定的时候给事件处理程序传递一些参数
$('div').on('click', {name: 'Byron', age: 24}, function(e){
console.log(e.data);
});
4.bind、unbind、delegate、live、on、off都有什么作用
- bind：给元素绑定一个或多个事件
$("#btn").bind("click.myClick", function() {
console.log("我被点击了")
})
- unbind：给元素解绑事件
$("#btn").unbind("click.myClick")
- delegate：用于事件代理，为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数；适用于当前或未来的元素（比如由脚本创建的新元素）。
$("ul").delegate("li", "click", function() {
var text = $(this).text()
console.log(text)
})
- live():这种方法是将页面的document元素作为事件代理元素，太消耗资源，已经过时。在新版本中推荐用.on()法，即时在旧版本中，也推荐使用.delegate()方法来取代.live()方法。
- on：在选定的元素上绑定一个或多个事件处理函数，提供绑定事件处理的所有功能。
//普通事件绑定
$("#btn").on("click",function(){
console.log("我被点击了")
})
//事件代理绑定
$("ul").on("click", "li", function() {
var text = $(this).text()
console.log(text)
})
- off：解除事件绑定
$("#btn").off("click.myClick")
推荐使用：
on方法，因为既能普通绑定事件，也能事件代理绑定
注意：on的事件代理和delegate的事件代理，写法不一样，子元素和触发事件的位置不同
//on的事件代理
$("ul").on("click", "li", function() {
var text = $(this).text()
console.log(text)
})
//delegate的事件代理
$("ul").delegate("li", "click", function() {
var text = $(this).text()
console.log(text)
})
/*li和click的位置不一样*/
