0

我有这个代码

<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
<script type="text/javascript"> 
 $(document).ready(function(){ 

$("#tiros").mouseover(function() { $("#hello").css('display',''); });
$("#hello").mouseover(function() { $("#hello").css('display',''); });
$("#hello").mouseout(function() { $("#hello").css('display','NONE'); });
 });
</script>

<link href="../css/tablas.css" rel="stylesheet" type="text/css" />
</head>

<body >
<div align="center">
    <style type="text/css"> 
td {
    vertical-align: top;
}
</style>

  <table id="tablas"  border="0">
    <caption id="titulo"> DISTRIBUCION DE MAQUINA SM74    <tr>
      <td><table  id="tablas" border="1">
        <tr>
          <td id="cabezera">07-06-2013</td>
          </tr>
                <tr>
          <td> <div align="right" id="tiros">20000</div>
           <div id="hello" style="display:NONE;position:absolute; z-index:1; ">
        <ul>
      <li id="Subtitulo">Nº OT: 19178</li>
      <li id="Subtitulo">Tipo: P</li>
      <li id="Subtitulo">Sucursal: ANTOFAGASTA</li>
      <li id="Subtitulo">Detalle: PEGABLE</li>
      <li id="Subtitulo">Cliente: ASOC. I</li>
    </ul>
    </div></td>
          </tr>
              </table></td>
      <td><table  id="tablas" border="1">
        <tr>
          <td id="cabezera">08-06-2013</td>
          </tr>
               <tr>
          <td> <div align="right" id="tiros">20000</div>
           <div id="hello" style="display:none; position:absolute; z-index:1;">
        <ul>
      <li>Nº OT: 19178</li>
      <li>Tipo: P</li>
      <li>Sucursal: ANTOFAGASTA</li>
      <li>Detalle: PEGABLE</li>
      <li>Cliente: ASOC. I</li>
    </ul>
    </div></td>
          </tr>
                </table>
      </td>
      <td><table  id="tablas" border="1">
        <tr>
          <td id="cabezera">09-06-2013</td>
          </tr>
              </table></td>
      <td><table id="tablas"  border="1">
        <tr>
          <td id="cabezera">10-06-2013</td>
          </tr>
              </table></td>
      <td><table  id="tablas" border="1">
        <tr>
          <td id="cabezera">11-06-2013</td>
          </tr>
              </table></td>
    </tr>
  </table>
</div>
</body>
</html>

当我将鼠标放在 div 上时，第一个 div 有效而另一个无效，id 的值对于所有 de div 都是“tiros”，我使用函数 mouseover 调用并且仅在第一次潜水时有效。很抱歉我的英语 :)

4

1 回答 1

0

id将具有多个相同值的标签更改为一个类。然后将 jQuery 函数中的选择器更改为您希望执行的操作，.而不是#.

因此，它将$(".tiros").mouseover(function() { $(".hello").css('display',''); });代替$("#tiros").mouseover(function() { $("#hello").css('display',''); });，并且您将对id使用多个实例调用 an 的其他函数进行更改。

于 2013-06-07T20:34:19.520 回答