通过改变z-index用Javascript激活其他表的表格单元格

Table cells that activate other tables with Javascript by changing the z-index

本文关键字：其他 表格 单元格 激活 Javascript 改变 z-index      更新时间：2023-09-26

我不知道这是怎么回事。我试过切换属性，将div放在每个表单元格内，并使用"单击"功能。但无论我怎么做，我似乎就是不能让它工作。所有我需要的只是表格单元格与其中的webblink信息，点击并打开二级表使用z-index格式重叠它们。如果有人能帮忙的话，我将不胜感激。

<script src="../js/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $('#weblinkbut').click(function(){
        $('.menuhome').css('z-index','3');
        $('.weblinkmenu').css('z-indez','4');
     });
</script>
</head>
<body>
<div id="weblinkbut">
<p>content</p>
</div>
<div id="menuhome">
<table class="menuhome" width="181" height="208" border="1" 
     bordercolor="#000000" cellspacing="5" bgcolor="#FFFFFF" cellpadding="">
<tr>
<td width="75" height="90"><p>&nbsp;</p><p><img src="images/weblinkicon.png"   
     width="40" height="40"></p>
    <p>Website link</p></div></td>
    <td width="75" height="90"><p><img src="images/phoneicon.png" 
     width="40" height="40"></p>
    <p>Phone Number</p></td>
</tr>
<tr>
    <td width="75" height="90"><p><img src="images/emailicon.jpg" width="40"     
         height="40"></p>
    <p>Email address</p></td>
    <td width="75" height="90"><p><img src="images/newdocicon.png" width="30" 
     height="40">
    <P>Plain Text</P>    
</tr>
</table>
 </div>
 <div id="weblinkmenu">
<table class="weblinkmenu" width="181" height="208" border="1"    
     bordercolor="#000000" cellspacing="5" bgcolor="#FFFFFF" cellpadding="">
    <tr>
        <td width="75" height="90"><p><img src="images/weblinkicon.png" 
                width="40" height="40"></p>
            <p>Website link</p></td>
    </tr>
</table>
 </div>
 </body>
  </html>

当您尝试为click事件绑定处理程序时，DOM未完全加载。试一试:

$(document).ready(function(){
  $('#weblinkbut').click(function(){
    $('.menuhome').css('z-index','3');
    $('.weblinkmenu').css('z-indez','4');
  });
});
相关文章：