遇到了一个很困扰我的问题。我正在编写一个基于网络的工具，在网页中，我有一个公告，点击后将显示或隐藏最近的更新——即下面代码中的“点击查看/隐藏公告”行。这曾经有效，但在几个版本之后，现在点击时不显示更新。在并行网页中，相应部分可以毫无问题地显示/隐藏更新。我什至复制了相应的部分(代码是bleow)并放入我的页面，它仍然不起作用。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="mydc.css" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="thickbox-compressed.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
<script type="text/javascript">
// some javascript functions here
</script>
</head>
<body>
<div id="title"><h1>My tool</h1></div>
<table id="bulletin" class="invis">
<tr class="invis">
<td class="invis">
<div id="bulletinslider">
<a style="color:red;">
Updated 2013.05.04 (Click to view/hide bulletin)</a><br/><br/>
</div>
<div id="updates" style="display:none;">
<u>New changes</u>
<ul>
<li>some update aaa bbb.</li>
</ul><br/>
<u>Previous changes</u> (2012.11.27)
<ul>
<li>some update ccc ddd.</li>
<li>some update eee fff.</li>
<li>some update ggg hhh.</li>
<li>some update iii jjj<br/></li>
</ul><br/>
<u>Announcements</u>
<ul><li>None.</li></ul><br/><br/>
</div>
</td>
</tr>
</table>
<!-- html code with php scripts continue -->
</body>
</html>
并在 css 文件 (mydc.css) 中
.invis {
background-color:inherit;
border-style:none;
}
为什么点击公告不起作用？ 此外，我不太明白如何触发公告点击。 感谢您的帮助!
最佳答案
我认为您的 JavaScript 代码中缺少 click 事件。请检查您的代码是否存在。您可以构造一个 click 事件来切换更新的信息元素，如下所示:
$("#bulletinslider a").click( function () {
//will either show or hide updates div depending on its state currently
$("#updates").toggle(100);
});
CSS 无法执行显示和隐藏其 native 范围内的其他元素等操作。
因此，一定要检查 js click 事件。有关该点击事件的更多文档，请访问 jquery.com .另请阅读 event delegation
关于HTML 点击查看和隐藏公告，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16946693/