css 错误与模态弹出窗口关闭了与onclick事件javascript

jogvjijk  于 2023-04-23  发布在  Java
关注(0)|答案(1)|浏览(162)

试图处理弹出窗口关闭了。但我有一个错误。这个问题是指的关键字?
https://codesandbox.io/s/tours-test-slick-v1uw96?file=/index.js:626-1309

// Get the modal
const modal = document.getElementById("myModal");

// Get the button that opens the modal
const btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
const close = document.getElementsByClassName("closeBtn");

// When the user clicks the button, open the modal
btn.onclick = function () {
  modal.style.display = "block";
};

// When the user clicks on <span> (x), close the modal
close.onclick = function () {
  modal.style.display = "none";
};

// When the user clicks anywhere outside of the modal, close it
window.onclick = function (event) {
  if (event.target == this.modal) {
    modal.style.display = "none";
  }
};
gg58donl

gg58donl1#

你试图通过classname获取close按钮,这将返回一个包含所有元素的数组,因此,你需要对按钮进行详细说明。
您可以使用const close = document.getElementsByClassName("closeBtn")[0];或为按钮设置一个id

相关问题