Jquery之事件冒泡和移出事件

冒泡事件

例如:div绑定一个click事件,而镶嵌在div的span标签也绑定一个click事件,这样就有两个元素响应一个事件.

栗子:

<a href="#">这是一个连接...</a>
<div>
div元素
<span>span元素</span>
</div>
<div id="result">
<script>
$("a").bind("click",function(event){
	alert(event.target);
	alert(event.relatedTarget);	
 //阻止元素默认行为,例如,当点击链接或者表单提交时有不经过的内容则能够使用此方法,和       //	return false功能相同
	 event.preventDefault();
	//return false;
});
 $("div").bind("click",function(event){
	 var divHtml=$("div").html();
	 $("#result").html(divHtml);
 });
 $("span").bind("click",function(event){
	 var spanHtml=$("span").html();
	 $("#result").html(spanHtml);
	// event.stopPropagation();
 });

移出事件:

bind()的反向操做，从每个匹配的元素中删除绑定的事件。

 

unbind(type,[data|fn])

Type:事件响应类型,click,submit,blur等

Data|Fn:要移出绑定的方法名称

 

若是没有参数，则删除全部绑定的事件。

你能够将你用bind()注册的自定义事件取消绑定。

若是提供了事件类型做为参数，则只删除该类型的绑定事件。

若是把在绑定时传递的处理函数做为第二个参数，则只有这个特定的事件处理函数会被删除。

栗子:

$("span").bind("click",function(event){
	 var spanHtml=$("span").html();
	 $("#result").html(spanHtml);
	 event.stopPropagation();
 }); 
 //若是这样放在一块儿写,在页面加载完毕后,上面的的click绑定事件将再也不有效
 $("span").unbind("click");

若是在一次绑定事件响应后,再也不起做用,咱们能够用

one(type,[data],fn)

为每个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数

 

type:添加到元素的一个或多个事件。由空格分隔多个事件。必须是有效的事件。

data:将要传递给事件处理函数的数据映射(这个是什么东西啊?)

fn:每当事件触发时执行的函数。

 

栗子:

 //一次性的绑定事件,只在第一次点击后有效,其余的均无效

  $("span").one("click",function(){

 var spanHtml=$("span").html();

 $("#result").html(spanHtml);

 event.stopPropagation();

 });