bind()方法的其它用法
bind()方法的其它用法
bind()方法不仅能为元素绑定浏览器支持的具有相同名称的事件，也可以绑定自定义事件。不仅如此，bind()方法还能做很多的事情。
1.绑定多个事件类型
例如可以为元素一次性绑定多个事件类型。jQuery代码如下：
$(function () {
$("div").bind("mouseover mouseout", function () {
$(this).toggleClass("over");
});
})
当光标插入div元素时，该元素的class切换为“over”;当光标画出“div”元素时，class切换为先前的值。这段代码等同于下面的代码：
$(function () {
$("div").bind("mouseover", function () {
$(this).toggleClass("over");
}).bind("mouseout", function () {
$(this).toggleClass("over");
});
})
很显然，第一种方法能减少代码量。
2.添加事件命名空间，便于管理
例如可以把元素绑定的多个事件类型用于命名空间规范起来，jQuery代码如下：
$(function () {
$("div").bind("click.plugin", function () {
$("body").append("<p>click 事件</p>");
});
$("div").bind("mouseover.plugin", function () {
$("body").append("<p>mouseover事件</p>");
});
$("div").bind("dblclick", function () {
$("body").append("<p>dblclick事件</p>")
});
$("button").click(function () {
$("div").unbind(".plugin");
});
})
在所绑定的事件类型后面添加命名空间，这样在删除事件时只需要指定命名空间即可。单击button元素后，“plugin”的命名空间被删除，而不在“plugin”的命名空间“dblclick”事件依然存在。
删除多个事件代码也可以写为以下链式代码,但显然下面的方式写的更少。
$("div").unbind("click").unbind("mouseover");
3.相同事件名称，不同命名空间执行方法
例如可以为元素绑定相同的事件类型，然后以命名空间的不同按需要调用，jQuery代码如下：
$(function () {
$("div").bind("click", function () {
$("body").append("<p>click 事件</p>");
});
$("div").bind("click.plugin", function () {
$("body").append("<p>click.plugin</p>");
});
$("button").click(function () {
$("div").trigger("click!"); //注意click后面的感叹号
});
})
当单击div元素后，会同时触发click事件和click.plugin事件。如果知识单击button元素，则只触发click.plugin事件。注意，trigger(“click!”)后面的感叹号的作用是匹配多有不包含在命名空间中的click方法。
如果需要两者都被触发，改为如下代码即可：
$("div").trigger("click"); // 去掉感叹号
