stopImmediatePropagation&stopPropagation 区别

stopImmediatePropagation 与 stopPropagation 不一样之处 请仔细查看加粗的文字并结合图例理解。

stopImmediatePropagation 防止对事件流中当前节点中和全部后续节点中的事件侦听器进行处理。此方法会当即生效，而且会影响当前节点中的事件侦听器。

stopPropagation 防止对事件流中当前节点的后续节点中的全部事件侦听器进行处理。此方法不会影响当前节点 (currentTarget) 中的任何事件侦听器。

下面是以前项目中的一个对于这种问题的出错的例子。

js代码以下：

<!-- lang: js -->

/模拟浏览器自带的select效果/
$(function(){ $(".select").live('click',function(event){ var s=$(this); var z=parseInt(s.css("z-index")); var dt=$(this).find("dt"); var dd=$(this).find("dd"); var _show=function(){dd.slideDown(200);s.css("z-index",z+1);}; //展开效果 var _hide=function(){dd.slideUp(200);s.css("z-index",z);}; //关闭效果 var target = event.target; /2014-6-25 修复/ if(target.nodeName == 'DT' || $(target).parent().is('dt') ){ if($(this).find("dd").is(":hidden") && $(this).find("li").length){ _show(); /2014-10-8 17:34:23 修复，以前使用event.stopPropagation();/ event.stopImmediatePropagation(); }else{ _hide(); } } dd.find("a").click(function(event){ event.stopPropagation(); var html = $(this).html(), value = $(this).data("value"); dt.html(html); s.find('input:hidden').val(value); // 添加隐藏按钮控制 _hide(); }); //选择效果（如须要传值，可自定义参数，在此处返回对应的“value”值 ） $("body").click(function(i){ !$(i.target).parents(".select").first().is(s) ? _hide():"";}); }); });

html代码以下：

<!-- lang: css -->
<dl class="select width80">
									<dt>结束月份</dt>
									<dd>
										<ul class="J_month">
											<li>
												<a href="javascript:;" data-value="至今">至今</a>
											</li>
										</ul>
										<input type="hidden" name="endMonth" />
									</dd>
								</dl>