爲什麼我的DIV更改爲display ='none'（onclick JavaScript）？

我一直在這工作了一段時間，但我無法弄清楚爲什麼我的DIV不能改回顯示：無。它從顯示開始：我的CSS文件中沒有。當你點擊按鈕時，它將改變顯示的樣式='block'。我有一個退出標籤，我想在點擊它時關閉DIV。我可以用visibility ='hidden'來做到這一點，但我不明白爲什麼display ='none'不應該起作用。爲什麼我的DIV更改爲display ='none'（onclick JavaScript）？

<button class="btn" onclick="document.getElementById('abo').style.display = 'block';">Learn More</a> 
     <div id="abo"> 
      <?php include 'about-more.php';?> 
      <div id="about-more"> 
      <h2>Learn More</h2><br> 
      <a href="http://youngmarists.org/">For more info on Young Marists</a><br> 
      <p>Contributers to this website</p> 

      <?php 
       foreach($profiles as $profile => $item): 
      ?> 

      <section class="profile"> 
       <h4 class="name"><?php echo $item['name'];?></h4> 
       <p class="role"><?php echo $item['role'];?></p> 
       <img class="profile-img" src="profiles/<?php echo $item['img'];?>"></img> 
      </section> 

      <?php endforeach;?> 

      <i class="fa fa-times-circle fa-2x" onclick="document.getElementById('abo').style.display = 'none';"; style="position:fixed;top:6%;right:18%;"></i> 
      </div>

來源

2017-10-15 Toby Meyrick

可見性：當您同時顯示按鈕和出口標籤時，hidden實際上不起作用。 –

在代碼的頂部，結束標記應該是。現在，你在那裏：

<button class="btn" onclick="document.getElementById('abo').style.display = 'block';">Learn More</a>

但它應該是：

<button class="btn" onclick="document.getElementById('abo').style.display = 'block';">Learn More</button>

https://jsfiddle.net/p4pun8qz/

此外，還有一個額外的分號在這裏：

onclick="document.getElementById('abo').style.display = 'none';";

嘗試：

onclick="document.getElementById('abo').style.display = 'none';"

來源

2017-10-15 01:06:06

似乎在問題本身中存在拼寫錯誤。 – bhansa

非常感謝，最愚蠢的事情，但我只是沒有看到它。 –

因爲你已經嵌套在<button>在您<i>標籤和你display = 'block'的onClick是按鈕本身內部從來沒有觸發onclick事件。

您需要稍微重新安排您的HTML或將第一個onClick移到其他位置以修復它。如果您將<i>元素移出<button>，您會明白我的意思。

如果您不打算讓<button>標籤包裝所有東西，那麼一定要將其關閉，因爲它當前保持打開狀態。

來源

2017-10-15 01:02:10

您正在關閉<button>並在第一行顯示</a>。將</a>更改爲</button>，它應該可以工作。

在onclick屬性後，您的<i>中也有太多分號。

來源

2017-10-15 01:04:45 o01

爲什麼我的DIV更改爲display ='none'（onclick JavaScript）？

回答

相關問題