stopPropagation与stopImmediatePropagation的区别

之前只知道js里有个stopPropagation(),不知道还有个stopImmediatePropagation()（本人孤陋寡闻，让你们笑话了），今天看到有段代码里出现了stopImmediatePropagation()这个方法，就研究了一下它的用法以及和stopPropagation()的区别。

它们的共同点：
都是阻止后续的侦听行为，即能阻挡掉事件流中事件的冒泡，简而言之就是让后面的侦听都不执行；

不一样点：
是拥有事件监听函数的当前的节点是否执行该函数，stopPropagation()方法阻止事件对象移到到另外一个节点上，可是容许当前节点的其余事件监听函数执行，而stopImmediatePropagation()方法不只阻止事件从当前节点移动到另外一个节点上，它还不容许当前节点的其余事件监听函数执行。

可能上面所述有些拗口，下面举个例子更有助于理解：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<style>
	.contDiv {padding:30px;background:#ccc;}
	.show {background:#666;display:inline-block;height:24px;width:300px;text-align:center;}
	.show a {color:#fff;font:12px/24px arial;text-decoration:none;}
</style>
<div class="contDiv">
	<input type="text" class="testInput" placeholder="请输入文字" />
	<span class="show"></span>
</div>
<script>
	$(function(){
		$(".testInput").keyup(function(e){
			$(".show").html("<a href='http://www.candoudou.com' title='前端开发' target='_blank'>http://www.candoudou.com</a>");
			//比较注释和不注释这一行的区别，stopImmediatePropagation能够阻止在这以后绑定的事件
			//e.stopImmediatePropagation();
		});
		$(".testInput").keyup(function(e){
			$(".show").html("<a href='http://www.rcttt.com' title='前端开发' target='_blank'>http://www.rcttt.com</a>");
		});
	});
 </script>

stopPropagation是阻止默认事件监听函数。不是jQuery独有，阻止默认事件的冒泡，好比监听了DOM节点和该节点的父节点的事件，默认是事件执行将从里到外，这就是所谓的冒泡。在IE浏览器中能够使用event.cancelBubble=false来作到，标准浏览器使用event.stopPropagation方法。jQuery也把stopPropagation扩展方式到IE上这样有了一致的方法。