关于鼠标经过不同的文字在表格同一地方显示不同内容的问题

给你个例子
<script>
function show(o)
  {showInfo.innerHTML=o.innerHTML;
  }
function hid()
  {showInfo.innerHTML="";
  }
</script>
<span onmouseover="show(this)" onmouseout="hid()">text1</span>
<span onmouseover="show(this)" onmouseout="hid()">text2</span>
<span onmouseover="show(this)" onmouseout="hid()">text3</span>
<span onmouseover="show(this)" onmouseout="hid()">text4</span>
<span onmouseover="show(this)" onmouseout="hid()">text5</span>
<div id="showInfo"></div><span onmouseover="show(this)" onmouseout="hid()">text1</span>
<span onmouseover="show(this)" onmouseout="hid()">text2</span>
<span onmouseover="show(this)" onmouseout="hid()">text3</span>
<span onmouseover="show(this)" onmouseout="hid()">text4</span>
<span onmouseover="show(this)" onmouseout="hid()">text5</span>
<div id="showInfo"></div>

解决方案 »

  1.   

    简单的例子
    <html><head><title>层与按钮对齐</title></head><body>
    <div align=left><table border=1 width=600 height=50>
    <tr align=center>
      <td>
        <input type=button value=ok onmouseover="cc(this)" alt="提示信息一"
         onmouseout="document.all.pop.style.display='none'">
      </td><td>
        <input type=button value=ok onmouseover="cc(this)" alt="提示信息二"
         onmouseout="document.all.pop.style.display='none'">
      </td><td>
        <input type=button value=ok onmouseover="cc(this)" alt="提示信息三"
         onmouseout="document.all.pop.style.display='none'">
      </td></tr>
    </table><div><div id=pop style="
      position: absolute;
      width: 120;
      height: 30;
      z-index: 99;
      display: none;
      background-color: #FF0000"
    >
    图层文字</div><script language=javascript>
    function cc(tt)
    {
      var e  = document.getElementById("pop");
      var t  = tt.offsetTop;     //TT控件的定位点高
      var h  = tt.clientHeight;  //TT控件本身的高
      var l  = tt.offsetLeft;    //TT控件的定位点宽
      var ttyp  = tt.type;       //TT控件的类型
      while (tt = tt.offsetParent){t += tt.offsetTop; l += tt.offsetLeft;}
      e.style.top  = (ttyp=="image")? t + h : t + h + 6; //层的 Y 坐标
      e.style.left = l + 1;      //层的 X 坐标
      e.style.display = "block"; //层显示
      e.innerText = window.event.srcElement.alt;
    }
    </script>
    </body></html>
      

  2.   

    <input type="text" name="t1">
    <script language="javascript">
    function show_text(id){
     document.all.t1.value=id.innerText
    }
    </script>
    <textarea id="link" onmouseover="show_text(link)">dfasdfasdfa</textarea>
      

  3.   

    <script>
    function show(o)
      {showInfo.innerHTML=o.innerHTML;
      }
    function hid()
      {showInfo.innerHTML="";
      }
    </script>
    <span onmouseover="show(this)" onmouseout="hid()">text1</span>
    <span onmouseover="show(this)" onmouseout="hid()">text2</span>
    <span onmouseover="show(this)" onmouseout="hid()">text3</span>
    <span onmouseover="show(this)" onmouseout="hid()">text4</span>
    <span onmouseover="show(this)" onmouseout="hid()">text5</span>
    <div id="showInfo"></div>可以显示不同内容，但是内容的话可以自己控制，显示内容不是点击文字的内容，
    而是另外一个可以自己单独控制的地方
    请问如何做呢？
      

  4.   

    好像meizz(梅花雪) 的解答可以完全解决这个问题
      

  5.   


    <html><head><title>文字不同显示</title></head><body>
    <div align=left><table border=1 width=600 height=50>
    <tr align=center>
      <td>
        <input type=button value=ok onmouseover="cc(pop)" alt="提示信息一"
         onmouseout="document.all.pop1.style.display='none'">
      </td><td>
        <input type=button value=ok onmouseover="cc(pop2)" alt="提示信息二"
         onmouseout="document.all.pop2.style.display='none'">
      </td><td>
        <input type=button value=ok onmouseover="cc(pop3)" alt="提示信息三"
         onmouseout="document.all.pop3.style.display='none'">
      </td></tr>
    </table><div>
    <div id=pop style="position: absolute; width: 174px; height: 82px; z-index: 99; display: none; background-color: #FF0000; left: 535px; top: 73px;"
    > 图层文字fdsfasds</div>
    <div id=pop2 style="position: absolute; width: 174px; height: 82px; z-index: 99; display: none; background-color: #FF0000; left: 535px; top: 73px;"
    > 图层文字fdsafdsfds</div>
    <div id=pop3 style="position: absolute; width: 174px; height: 82px; z-index: 99; display: none; background-color: #FF0000; left: 535px; top: 73px;"
    > 图层文字sdfasdfas</div>
    <script language=javascript>
    function cc(tt)
    {
      var e  = document.getElementById(tt);
      e.style.top  = 73; //层的 Y 坐标
      e.style.left = 535;      //层的 X 坐标
      e.style.display = "block"; //层显示
      e.innerText = tt.innerText
    }
    </script>
    </body></html>
    这里不能按照要求显示，主要是，参数的传和取我不知道怎么做
    比如pop2.innerText 怎么把参数传到cc() 中的e.innerText希望指点