我已經通過2個與彈出窗口中使用html和javascript類似項目的網絡相關的類,但問題是彈出窗口根本不會顯示或顯示半秒和立即關閉自己。我不能發佈整個代碼,但這裏的代碼粗塊(我把劇本在文件的最底部,HTML標記外):使用javascript彈出窗口不能正常顯示
<script type="text/javascript">
\t var popup = document.getElementById('popup');
\t var btn = document.getElementById('btn_popup');
\t var close = document.getElementById('close');
\t btn.onclick = function(){
\t \t popup.style.display = "block";
\t }
\t close.onclick = function(){
\t \t popup.style.display = "none";
\t }
</script>
<html>
<body>
<div id="titleBar">
\t \t <h2>Title</h2>
\t \t <div>
\t \t \t <form action="page.php" method="get">
\t \t \t \t <input type="text" name="item"> by
\t \t \t \t <select name="search">
\t \t \t \t \t <option value="v1">Value 1</option>
\t \t \t \t \t <option value="v2">Value 2</option>
\t \t \t \t \t <option value="v3">Value 3</option>
\t \t \t \t </select>
\t \t \t \t <input type="submit" value="SEARCH">
\t \t \t \t <button id="btn_popup">Popup Button</button>
\t \t \t </form>
\t \t </div>
\t </div>
\t <div id="popup">
\t \t <div id="popup_content">
\t \t \t <header>
\t \t \t \t <span id="close">X</span>
\t \t \t \t <p>Popup Form</p><br>
\t \t \t </header>
\t \t \t <article>
\t \t \t \t <div>
\t \t \t \t \t <form method="POST" action="page.php">
\t \t \t \t \t \t <input type="text" name="n1" placeholder="N1">
\t \t \t \t \t \t <input type="text" name="n2" placeholder="N2">
\t \t \t \t \t \t <input type="text" name="n3" placeholder="N3">
\t \t \t \t \t \t <input type="text" name="n4" placeholder="N4"><br>
\t \t \t \t \t \t <select name="list">
\t \t \t \t \t \t \t <option value="">Select One</option>
\t \t \t \t \t \t \t <?php
\t \t \t \t \t \t \t \t //code to generate options
\t \t \t \t \t \t \t ?>
\t \t \t \t \t \t </select><br>
\t \t \t \t \t \t <input type="submit" value="Click">
\t \t \t \t \t </form>
\t \t \t \t </div>
\t \t \t </article>
\t \t </div>
\t </div>
</body>
</html>
我複製這些來自其他頁面的代碼部分,但他們不再在這個頁面上工作,但他們在上一頁上工作沒有任何問題。我也使用PHP來生成彈出窗體中的下拉列表。在上一頁中,彈出窗口顯示爲應該顯示,但在此頁面中,彈出窗口僅顯示半秒鐘,然後單獨關閉。
有沒有解決這個問題?或者至少有任何關於這個問題的線索?並且請不要推薦我使用框架(除了w3,而不是w3模塊)來解決這個問題。我正在使用最新的Google Chrome瀏覽器查看這些文件,這些文件也已經在Mozilla上試用過,但也給出了相同的結果。