js函数中 如何阻止事件冒泡

何为冒泡事件。

就是当设定了多个div的嵌套时;即建立了父子关系,当父div与子div共同加入了onclick事件时,当触发了子div的onclick事件后,子div进行相应的js操作。但是父div的onclick事件同样会被触发。这就造成了事件的多层并发,导致了页面混乱。这就是冒泡事件。
消除冒泡事件的方法

阻止JavaScript事件冒泡传递(cancelBubble 、stopPropagation)

html中 [input id="text1"  type="text" onclick="F_Bind_ZhongLeiClick(this)"  /]

script中 该怎样阻止事件冒泡啊 
function F_Bind_ZhongLeiClick(ele) {
            //jquery代码
            //
        }

不想使用这种绑定方法
$("#text1").bind("click",function(e){
});

// 第一种
// html 加return false
//[input id="text1"  type="text" onclick="F_Bind_ZhongLeiClick(this);return false;"  /]
 
// 第二种,结合html和js一起
// 函数调用前加return,这样函数里可以控制要不要阻止
// [input id="text1"  type="text" onclick="return F_Bind_ZhongLeiClick(this);"  /]
 
// js中return false是阻止,return true是不阻止
function F_Bind_ZhongLeiClick(ele) {
    return false;
}

首先:你不想使用的方法恰恰是推荐的最好的方法,为什么不用推荐的方法呢。
如果实在想用第一种,
onclick="F_Bind_ZhongLeiClick(this);return false;"

==========================================================

http://tieba.baidu.com/f?kz=877165769
原文出处:http://www.fydir.com/Home/article/399/1.aspx?RouteExistingFiles=False&Count=23

下面的一段代码即可以很好的解释是么是冒泡效果,什么叫消除冒泡效果
[html]
[head]
[title]
阻止JavaScript事件冒泡传递(cancelBubble 、stopPropagation)
[itle]
[meta name="keywords" content="JavaScript,事件冒泡,cancelBubble,stopPropagation" /]
[script type="text/javascript"] 
function doSomething (obj,evt) { 
alert(obj.id); 
var e=(evt)?evt:window.event; //判断浏览器的类型,在基于ie内核的浏览器中的使用cancelBubble
if (window.event) { 
e.cancelBubble=true; 
} else { 
//e.preventDefault(); //在基于firefox内核的浏览器中支持做法stopPropagation
e.stopPropagation(); 
} } 
[/script]
[/head]
[body]
[div id="parent1" onclick="alert(this.id)" style="width:250px;background-color:yellow"]
  [p]This is parent1 div.[/p]
  [div id="child1" onclick="alert(this.id)" style="width:200px;background-color:orange"]
    [p]This is child1.[/p]
  [/div]
  [p]This is parent1 div.[/p]
[/div]
[br /]
[div id="parent2" onclick="alert(this.id)" style="width:250px;background-color:cyan;"]
  [p]This is parent2 div.[/p]
  [div id="child2" onclick="doSomething(this,event);" style="width:200px;background-color:lightblue;"]
    [p]This is child2. Will bubble.[/p]
  [/div]
  [p]This is parent2 div.[/p]
[/div]
[/body]
[/html]

把代码直接复制后,打开当点击child1时不仅会弹出 child1 对话框还会弹出 parent1
这就是冒泡事件

但是单击chile2只会弹出child2却不会弹出 parent2,这便是应用了阻止冒泡事件的特效的效果.
详细:请访问www.fydir.com 发源地分享你的智慧

==========================================================

[!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]js阻止事件冒泡的DEMO[/title]
[script type="text/javascript"]
//阻止冒泡的方法
function stopPP(e)
{
var evt = e || window.event;
//IE用cancelBubble=true来阻止而FF下需要用stopPropagation方法
evt.stopPropagation ? evt.stopPropagation() : (evt.cancelBubble=true);
}
[/script]
[/head]
[body]
[div style="margin: 150px 400px;width: 700px; height: 550px; background-color: #878788;" onclick="alert('最外层div上的onclick事件');"]
  [h2]最外层div上的onclick事件[/h2]
  [div style="margin: 100px; width: 500px; height: 300px; background-color: #545444;" onclick="stopPP(arguments[0]);alert('中间层div上的onclick事件');"]
    [h3]中间层div上的onclick事件[/h3]
    [div style="margin: 60px 100px; height: 100px; width: 300px; background-color: red;" onclick="stopPP(arguments[0]);alert('最内层div上的onclick事件');"]
      [h4]最内层div上的onclick事件”[/h4]
    [/div]
  [/div]
[/div]
[/body]
[/html]

==========================================================

[!doctype html]
[html]
[head]
[meta charset="gb2312"]
[title]无标题文档[/title]
[/head]
[body]
[div id="c1" onclick="alert(1)"]
  [div id="c2" onlick="alert(2)"]
    [input type="button" id="c3" value="点击" xonclick="alert(3)" onClick="runc3();return false;"]
  [/div]
[/div]
[script type="text/javascript"]
function runc3(){
alert('f3');
}
document.getElementById('c3').addEventListener('click',function(e){e.stopPropagation()},false);
[/script]