綁定多個事件類型
比如可以為元素一次性綁定多個事件
$(function(){
$('#btn').bind('mouseover mouseout',function(){
$(this).toggleClass('highlight')
})
})
代碼演示
當(dāng)光標(biāo)劃入按鈕時灶体,class切換為highlight掐暮,移出時,class切換為原來的值织中。等同于下面代碼
$(function(){
$('#btn').mouseover(function(){
$(this).toggleClass('highlight')
}).mouseout(function(){
$(this).toggleClass('highlight')
})
})
添加事件命名空間衷戈,便于管理
比如可以把為元素綁定的多個事件類型用命名空間規(guī)范起來层坠,代碼如下:
$(function(){
$('#btn').bind("mouseover.plugin",function(){
$('#msg').text('加入了plugin~')
}).bind("mouseout.plugin",function(){
$('#msg').text('準(zhǔn)備移除plugin')
$(this).unbind(".plugin")
}).click(function(){
$(this).next().text('plugin事件消失~~')
})
})
代碼演示
相同事件名稱谦趣,不同命名方法
比如可以為元素綁定相同的事件,然后以命名空間的不同按需調(diào)用前鹅,代碼如下:
$(function(){
$('div').bind('click.plugin',function(){
$('body').append('<p>click---plugin</p>')
}).bind('click',function(){
$('body').append('<p>click</p>')
})
$('#btn').click(function(){
$('div').trigger("click!")//嘆號的作用是匹配所有不包含在命名空間中的click方法
})
})
p.s帶感嘆號這個寫法在1.9以上的版本已被廢棄,這里只提供一種思路蹂喻。