时间戳

首页 > 解决方案 > 当显示从无设置为块时，Div 中的所有元素都不出现

javascript - 当显示从无设置为块时，Div 中的所有元素都不出现

问题描述

我正在尝试制作一个在用户完成特定任务时会出现的弹出窗口。此弹出窗口应包含一个链接，显示关闭（允许他们关闭弹出窗口），只要它出现。我的问题是，当显示从无设置为阻止时，虽然链接在 div 内，但它不会显示。

function closePopup() {
  document.getElementById("popup").style.display = "none";
}

function openPopup() {
  document.getElementById("popup").style.display = "block";
  document.getElementById('popup').innerHTML = 'This is the popup';
}
#popup {
  display: none;
  padding: 1.5% 0 1.5% 0;
  background-color: #afcb59;
  width: 40%;
}
<body>
  <div id="popup">
    <a href="#" onclick="closePopup()">Close</a>
    <p></p>
  </div>
  <a href="#" onclick="openPopup()">Open</a>
</body>

标签： javascripthtmlcss

解决方案

您需要添加innerHTML到该段落而不是div.

function closePopup() {
  document.getElementById("popup").style.display = "none";
}

function openPopup() {
  document.getElementById("popup").style.display = "block";
  document.getElementById('text').innerHTML = 'This is the popup';
}
#popup {
  display: none;
  padding: 1.5% 0 1.5% 0;
  background-color: #afcb59;
  width: 40%;
}
<body>
  <div id="popup">
    <a href="#" onclick="closePopup()">Close</a>
    <p id="text"></p>
  </div>
  <a href="#" onclick="openPopup()">Open</a>
</body>

推荐阅读