通过更改 z-index 使用 Javascript 激活其他表格的表格单元格答案

【问题标题】：Table cells that activate other tables with Javascript by changing the z-index通过更改 z-index 使用 Javascript 激活其他表格的表格单元格
【发布时间】：2013-05-16 20:31:24
【问题描述】：

我不知道这是怎么回事。我尝试过切换属性，将 div 放在每个表格单元格中，并将其用于“单击”功能。但无论我做什么，我似乎都无法让它发挥作用。我所需要的只是其中包含网络链接信息的表格单元格，单击并使用 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>

【问题讨论】：

标签： javascript html-table cell z-index

【解决方案1】：

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

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

【讨论】：

没用。我已将您发送的脚本复制并粘贴到我的文档中，但仍然没有。我正在尝试使用带有 weblink 图标的表格单元格，所以当我点击它时，我会打开 weblinkmenu，将 menuhome 与 css 样式的 z-index 重叠。