Question

<html>
<head>
<style type="text/css">
div.panel
{
height:20px;
display:none;}

</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("img").click(function(){
    $(".panel").toggle();
  });
});
</script>

</head>
<body>

<TABLE border="1">
<TR>
 <TD>to see whats hidden under here press to image</TD>
 <TD>IMG SRC=".jpg" WIDTH="20" HEIGHT="20" BORDER="0" ALT=""</TD>
</TR>
</TABLE>
<div class="panel"><p>Haa haa, nothin</p></div>

<TABLE border="1">
<TR>
 <TD>wanna see what under here?</TD>
 <TD>IMG SRC=".jpg" WIDTH="20" HEIGHT="20" BORDER="0" ALT=""</TD>
</TR>
</TABLE>
<div class="panel"><p>treasure from bottom of ocean</p></div>

</body>
</html>

Porblem是，当我按第一或第二张图像时，我看到隐藏的第一件事和隐藏的第二件事。我想这样做，当我按下第一张图像时，我只看到隐藏在那里的东西，我可以切换它，而不仅仅是显示而且永远不会再隐藏。

Answer 1

尝试：

$(document).ready(function(){
  $("img").click(function(){
    $(this).closest('table').next(".panel").toggle();
  });
});

如何在我需要的所有位置使用相同的脚本？

1 个答案: