如何让程序等待模式 window 关闭？

Question

本质上，我正在尝试重新创建“警报”和“提示”功能，但在使用模态 window 的单个功能中。我对其进行了设置，以便当函数的一个参数设置为 1 时，它会向模态 window 添加一个文本字段，并在关闭时记录该文本字段的值。我无法做到这一点，因此当 window 打开时，程序会一直等到 window 再次关闭。我该怎么做？

Answer 1

您需要学习如何使用 async 和 await 来实现承诺。下面的基本思想显示了如何将 promise 与事件处理程序一起使用以发出单击信号。

const myAlert = async(message) => {
  return new Promise((resolve) => {
    var modal = document.createElement("div");
    modal.classList.add("modal");
    modal.innerHTML = `
    <div class="modal-content">
      <span class="close">&times;</span>
      <p>${message}</p>
    </div>
  `;
    modal.querySelector(".close").addEventListener("click", function() {
      modal.remove();
      resolve();
    });
    document.body.append(modal);
  });

}


(async function() {

  console.log('before');
  await myAlert('Hello there');
  console.log('after');

})();

.modal {
  display: block;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
  background-color: #fefefe;
  margin: 15% auto;
  /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
  /* Could be more or less, depending on screen size */
}

.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

如何让程序等待模式 window 关闭？

How can I make a program wait for a modal window to close?

javascript

modal-window