jquery 自定义事件triggerhandler
在jquery中，可以使用triggerhandler来设计自定义事件，比如一般的事件：
$('#id').on("click", function() {
alert("Item clicked");
}
);
而对于自定义事件，一般期望能达到如下的效果：
$('#id').on("test.says.hello", function()
{
alert("Hello Cory");
});
这个就叫自定义事件了。又比如假如提供一个jquery的插件，比如是lightbox的效果，在打开时
$(function() {
$('#id').on("lightbox.open", function() {
alert("The lightbox just opened. Woo!");
});
});
则必须编写自定义事件如下：
function open() {
$('#id')triggerHandler({ type:"lightbox.open" });
}
如果自定义事件中需要有参数传出去，可以这样
$('#id').triggerHandler({
type:"lightbox.open",
var1:'Howdy',
information:'I could pass something here also'
});
则调用的时候：
$(function() {
$('#id').on("lightbox.open", function(o) {
alert(o.var1 + " - " + o.information);
});
}
);
下面来看下trigger和triggerhandler的区别：
triggerHandler() 方法触发被选元素的指定事件类型。但不会执行浏览器默认动作，也不会产生事件冒泡。
triggerHandler() 方法与 trigger() 方法类似。不同的是它不会触发事件（比如表单提交）的默认行为，而且只影响第一个匹配元素。
与 trigger() 方法相比的不同之处
它不会引起事件（比如表单提交）的默认行为
.trigger() 会操作 jQuery 对象匹配的所有元素，而 .triggerHandler() 只影响第一个匹配元素。
由 .triggerHandler() 创建的事件不会在 DOM 树中冒泡；如果目标元素不直接处理它们，则不会发生任何事情。
该方法的返回的是事件处理函数的返回值，而不是具有可链性的 jQuery 对象。此外，如果没有处理程序被触发，则这个方法返回 undefined。
例子区别如下：
$('#id').on("click", function() {
alert("Item clicked");
}
);
而对于自定义事件，一般期望能达到如下的效果：
$('#id').on("test.says.hello", function()
{
alert("Hello Cory");
});
这个就叫自定义事件了。又比如假如提供一个jquery的插件，比如是lightbox的效果，在打开时
$(function() {
$('#id').on("lightbox.open", function() {
alert("The lightbox just opened. Woo!");
});
});
则必须编写自定义事件如下：
function open() {
$('#id')triggerHandler({ type:"lightbox.open" });
}
如果自定义事件中需要有参数传出去，可以这样
$('#id').triggerHandler({
type:"lightbox.open",
var1:'Howdy',
information:'I could pass something here also'
});
则调用的时候：
$(function() {
$('#id').on("lightbox.open", function(o) {
alert(o.var1 + " - " + o.information);
});
}
);
下面来看下trigger和triggerhandler的区别：
triggerHandler() 方法触发被选元素的指定事件类型。但不会执行浏览器默认动作，也不会产生事件冒泡。
triggerHandler() 方法与 trigger() 方法类似。不同的是它不会触发事件（比如表单提交）的默认行为，而且只影响第一个匹配元素。
与 trigger() 方法相比的不同之处
它不会引起事件（比如表单提交）的默认行为
.trigger() 会操作 jQuery 对象匹配的所有元素，而 .triggerHandler() 只影响第一个匹配元素。
由 .triggerHandler() 创建的事件不会在 DOM 树中冒泡；如果目标元素不直接处理它们，则不会发生任何事情。
该方法的返回的是事件处理函数的返回值，而不是具有可链性的 jQuery 对象。此外，如果没有处理程序被触发，则这个方法返回 undefined。
例子区别如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="Scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function() {
$("#txtContent").focus(function() {
$("#dv").html($("#dv").html() + "focus被触发。");
});
$("#btnTrigger").click(function() {
$("#txtContent").trigger('focus');
return false;
});
$("#btnTriggerHandler").click(function() {
$("#txtContent").triggerHandler('focus');
});
});
</script>
</head>
<body>
<form id="myForm" action="">
<input type="text" id="txtContent" name="txtContent" size="20" />
<input type="button" id="btnTriggerHandler" name="btnTriggerHandler" value="TriggerHandler" />
<input type="button" id="btnTrigger" name="btnTrigger" value="Trigger" />
<div id="dv">
</div>
①使用Trigger 时会先触发我们绑定的focus 事件，然后文本框会获得焦点，之后触发了浏览器默认的
focus事件，所以trigger 会有两次输出。
②TriggerHandler 相对于 Trigger 只会触发我们绑定的focus，而不会触发浏览器的默认事件.所以
只会有一次输出
</form>
</body>
</html>