DIV的 onmouseOver

二次发帖 改成这样<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body>
<script> 
var f;
function ShowDiv() 
{ document.getElementById("testdiv").style.visibility = "visible"; 
} 
function HiddenDiv() 
{ f=setTimeout("HiddenDivTimeOut()",3000); 
} 
function HiddenDivTimeOut() 
{ document.getElementById("testdiv").style.visibility = "hidden"; } function mouseoverDiv() 
{ } 
function mouseoutDiv() 
{ document.getElementById("testdiv").style.visibility = "hidden"; } 
</script> <table width = "100" border=1> 
<tr> 
      <td    onMouseOver="ShowDiv()" onMouseOut="HiddenDiv()" style="Cursor:Hand">1 
      </td> 
      <td    onMouseOver="ShowDiv()" onMouseOut="HiddenDiv()" style="Cursor:Hand">2 
      </td> 
</tr> </table> 
<div id="testdiv"  onMouseOver="ShowDiv();clearTimeout(f)" onMouseOut="mouseoutDiv()" style="position:absolute; width:400;height:285; z-index:1; padding:5px; background-color: #E1E8FB; layer-background-color: #E1E8FB; border: 10px #ffffff; visibility:hidden; overflow-y:auto;"> <table width=200 bgcolor="#000000"> 
<tr> 
<td> 
tabletabletabletdtatata 
</td> 
</tr> 
<tr> 
<td> 
tabletabletabletdtatata 
</td> 
</tr> 
<tr> 
<td> 
tabletabletabletdtatata 
</td> 
</tr> 
</table>
</div>
</body>
</html>

解决方案 »

  1.   

    DIV的位置要求随着鼠标移动的
      

  2.   

    前段時間寫了個easyTitle，參照著改一下好了：http://www.v-ec.com/jslib/【easyTitle】部分
      

  3.   

    DIV的位置随着鼠标移动, 鼠标怎么移动到DIV里面,和一楼需求冲突吧~~
      

  4.   

    难道是因为这些表格都在层里面 然后你onMouseOver的时候 就执行了ＤＩＶ中的方法？？？
      

  5.   

    div 和 table 起冲突 在用div标签的时候 尽量不要出现table标签 不好控制。
      

  6.   

    事件的冒泡没处理好，改成下面的就好了<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
    <script> 
    var inTable = false; 
    var inDiv = false; var IsIE=!!document.all;
    //下面这个是对firefox进行扩展的
    if(!IsIE)HTMLElement.prototype.contains=function(o){
      while(o!=null){
        if(o==this)return true;
        o=o.parentNode;
      }
      return false;
    }
    function ShowDiv() 
    { 
    inTable = true; 
    document.getElementById("testdiv").style.visibility = "visible"; 
    } 
    function HiddenDiv() 
    { 
    inTable = false; 
    setTimeout("HiddenDivTimeOut()",3000); 
    } 
    function HiddenDivTimeOut() 
    { 
    if(inTable == false && inDiv == false) 
    { 
    document.getElementById("testdiv").style.visibility = "hidden"; 
    } 
    } function mouseoverDiv() 
    { 
    inDiv = true; 
    } 
    function mouseoutDiv(div,e) 
    { 
    e=e||event;
    var obj=e.relatedTarget||e.toElement;
    if(div.contains(obj))return;
    inDiv = false; 
    if(inTable == false && inDiv == false) 
    { 
    document.getElementById("testdiv").style.visibility = "hidden"; 
    } 
    } 
    </script> 
    </head> 
    <body> 
    <table width = "100" border=1> 
    <tr> 
          <td    onMouseOver="ShowDiv()" onMouseOut="HiddenDiv()" style="Cursor:Hand">1 
          </td> 
          <td    onMouseOver="ShowDiv()" onMouseOut="HiddenDiv()" style="Cursor:Hand">2 
          </td> 
    </tr> </table> 
    <div id="testdiv"  onMouseOver="mouseoverDiv()" onMouseOut="mouseoutDiv(this,event)" style="position:absolute; width:400;height:285; z-index:1; padding:5px; background-color: #E1E8FB; layer-background-color: #E1E8FB; border: 10px #ffffff; visibility:hidden; overflow-y:auto;"> 
    <table width=200> 
    <tr> <td> 
    tabletabletabletdtatata 
    </td> 
    </tr> 
    <tr> 
    <td> 
    tabletabletabletdtatata 
    </td> 
    </tr> 
    <tr> 
    <td> 
    tabletabletabletdtatata 
    </td> 
    </tr> 
    </table> 
    </div> </body> </html>
      

  7.   

    不是频繁的执行DIV的onmouseover和onmouseout问题在你那个onMouseOut 的范围不包含<table> 
    如果改成这样：onMouseOut="mouseoutDiv();alert('out the div!')"
    一移到table他就提示 out the div!
      

  8.   


    参考了最近在学习ext
    这个是ext 的一个QQ交流群:68968308
      

  9.   

    showbo的问题是正解
    我阻止了事件的冒泡之后就OK啦，谢谢，：）
      

  10.   

    另外一种阻止冒泡的方式
    在 <table onmouseout='handleMouseFunc(event)'>function handleMouseFunc(oEvent)
    {
    if(oEvent.preventDefault) 
    {    
    //不是IE浏览器
       oEvent.preventDefault();    
       oEvent.stopPropagation();    
    } 
    else {    
    //IE浏览器
       oEvent.cancelBubble=true;    
       oEvent.returnValue = false;    
    }
    }