0

我遇到了一个让我很困惑的问题。我正在编写一个基于 Web 的工具,在网页中,我有一个公告,单击它会显示或隐藏最近的更新 --- 即下面代码中的“点击查看/隐藏公告”行。这曾经可以工作,但是在几个版本之后,现在单击时它不会显示更新。在并行网页中,相应部分可以毫无问题地显示/隐藏更新。我什至复制了相应的部分(代码自爆)并放入我的页面,它仍然无法正常工作。

<!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;
}

为什么点击公告不起作用?另外,我不太明白点击公告是如何触发的。谢谢你的帮助!

4

1 回答 1

0

我认为您click的 JavaScript 代码中缺少一个事件。如果存在,请检查您的代码。您可以构造一个click事件来切换您更新的信息元素,如下所示:

$("#bulletinslider a").click( function () {
    //will either show or hide updates div depending on its state currently
    $("#updates").toggle(100);
});

CSS 不能执行诸如在其本机范围内显示和隐藏其他元素之类的操作。

所以,一定要检查jsclick事件。有关该点击事件的更多文档,请访问jquery.com。还'阅读事件委托

于 2013-06-05T19:58:50.953 回答