HTML點擊查看和隱藏公告

我遇到了一個令我困惑的問題。我正在編寫一個基於網絡的工具，並且在網頁上有一個公告，點擊後會顯示或隱藏最近的更新---即下面代碼中的「點擊查看/隱藏公告」行。這用於工作，但在幾個版本之後，現在它不會在點擊時顯示更新。在並行網頁中，相應的部分可以顯示/隱藏更新而沒有問題。我甚至複製了相應的部分（代碼很漂亮）並放到我的頁面中，但它仍然不起作用。HTML點擊查看和隱藏公告

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

爲什麼點擊公告不起作用？另外，我不太清楚點擊公告是如何觸發的。感謝您的幫助！

來源

2013-06-05 Tony Xu

觸發點擊的代碼在哪裏？請在粘貼之前格式化HTML。我發現它很難理解嵌套:-) – krishgopinath

不太瞭解css。假設在CSS中應該有一些id =「bulletinslider」或類=「invis」觸發點擊功能的東西？ HTML標籤重新格式化。謝謝。 –

我認爲觸發動作的代碼位於javascript ..因此，將該代碼添加到問題中。當你在它的時候，刪除jquery的多個引用 - 你做了兩次 – krishgopinath

我想你在你的JavaScript代碼中缺少一個click事件。請檢查您的代碼是否存在。您可以構建一個click事件來切換您的updared信息元素是這樣的：

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

CSS不能執行像顯示和隱藏從其原有範圍的其他元素的動作。

因此，一定要檢查js click事件。欲瞭解更多關於該點擊事件的文檔，請訪問。另請參閱event delegation

來源

2013-06-05 19:58:50 krishgopinath

是的，你是對的。 –

HTML點擊查看和隱藏公告

回答

相關問題