javascript cancelBubble在Firefox上不工作

IE的打擊代碼工作正常，但在Firefox上不起作用，爲什麼？這是我的代碼中的一些問題？如何解決它？謝謝！javascript cancelBubble在Firefox上不工作

<html> 
<head> 
<style> 
body{font-family:Arial;font-size:12px;font-weight:normal;line-height:28px;} 
.product_tips{ 
width:500px; 
background:#f0f0f0; 
border:1px solid #ccc; 
padding:8px; 
margin-top:3px; 
} 
span{cursor:pointer;} 
</style> 
<script type="text/javascript"> 
    function get(id){ 
     return document.getElementById(id); 
    } 
    function showTip(e){ 
     if(get("product_tips").style.display == "none"){ 
     get("product_tips").style.display = "block"; 
    } else{ 
     get("product_tips").style.display = "none"; 
    } 
    stopBubble(e) 
} 
function stopBubble(e) { 
    if (e){ 
    e.stopPropagation(); 
    } 
    else{ 
    window.event.cancelBubble = true; 
    } 
} 
document.onclick = function(){ 
     get("product_tips").style.display = "none"; 
    } 
</script> 
</head> 
<body> 
<div class="relative_"> 
<label><input type="text" name="#" value="" id="product_name" maxlength="6" /></label>&nbsp;&nbsp;<span onclick="showTip();">help ?</span> 
       <div id="product_tips" class="product_tips" style="display:none;" onclick="stopBubble();"> 
        <div class="product_inbox"> 
         <p>content content content content content content content content content content content content content content content content content content content content </p> 
        </div> 
       </div> 
       </div> 
</body> 
<html>

演示在這裏：http://jsbin.com/ivosa3

來源

2010-07-23 lanqy

儘量不要設置事件處理程序中的屬性，而是將其設置爲腳本。以下作品在IE和Firefox中均可使用：

<html> 
<head> 
<style> 
body{font-family:Arial;font-size:12px;font-weight:normal;line-height:28px;} 
.product_tips{ 
width:500px; 
background:#f0f0f0; 
border:1px solid #ccc; 
padding:8px; 
margin-top:3px; 
} 
span{cursor:pointer;} 
</style> 
<script type="text/javascript"> 
    function get(id){ 
    return document.getElementById(id); 
    } 
    function showTip(e){ 
    if(get("product_tips").style.display == "none"){ 
    get("product_tips").style.display = "block"; 
    } else{ 
    get("product_tips").style.display = "none"; 
    } 
    stopBubble(e) 
} 
function stopBubble(e) { 
    if (e){ 
    e.stopPropagation(); 
    } 
    else{ 

    window.event.cancelBubble = true; 
    } 
} 
document.onclick = function(e){ 
    get("product_tips").style.display = "none"; 
    } 
</script> 
</head> 
<body> 
<div class="relative_"> 
<label><input type="text" name="#" value="" id="product_name" maxlength="6" /></label>&nbsp;&nbsp;<span id="help">help ?</span> 
     <div id="product_tips" class="product_tips" style="display:none;"> 
      <div class="product_inbox"> 
      <p>content content content content content content content content content content content content content content content content content content content content </p> 
      </div> 
     </div> 
     </div> 
    <script type="text/javascript"> 
     get('help').onclick = showTip; 
     get('product_tips').onclick = stopBubble; 
    </script> 
</body> 
<html>

來源

2010-07-23 04:07:07 Daniel

javascript cancelBubble在Firefox上不工作

回答

相關問題