可以当用户在JavaScript中单击外部时，不能关闭弹出窗口

我有这个问题，因为我的网站上的JS代码有问题。我在Js文件中创建了7个弹出窗口，并将该文件附加到我的index.php。当我全部使用它们时，只有最后一个起作用

index.php（片段）

我制作了这些弹出窗口，它们工作正常，但我在js中创建了这些函数，因为我想在用户单击弹出窗口外部时关闭它们。它只适用于我定义的最后一个版本（我的意思是popupBox_3），我想让它们都工作

---

求你了，我需要你的帮助

不能使用

Node.onclick

分配多个单击事件处理程序，每次这样做都会覆盖最后一个。你可以换成

window.addEventListener('click', function() {
   if (event.target == popupBox_1) {
        popupBox_1.style.display = "none";
    }
});

window.addEventListener('click', function() {
   if (event.target == popupBox_2) {
        popupBox_2.style.display = "none";
    }
});

...etc.

但将所有三个条件都移动到一次单击处理程序中会更有意义：

window.onclick = function(event) {
    if (event.target == popupBox_1) {
        popupBox_1.style.display = "none";
    }
    if (event.target == popupBox_2) {
         popupBox_2.style.display = "none";
    }
    if (event.target == popupBox_3) {
        popupBox_3.style.display = "none";
    }
}

---

您不能使用

节点分配多个单击事件处理程序。onclick

，每次这样做都会覆盖最后一个。你可以换成

window.addEventListener('click', function() {
   if (event.target == popupBox_1) {
        popupBox_1.style.display = "none";
    }
});

window.addEventListener('click', function() {
   if (event.target == popupBox_2) {
        popupBox_2.style.display = "none";
    }
});

...etc.

但将所有三个条件都移动到一次单击处理程序中会更有意义：

window.onclick = function(event) {
    if (event.target == popupBox_1) {
        popupBox_1.style.display = "none";
    }
    if (event.target == popupBox_2) {
         popupBox_2.style.display = "none";
    }
    if (event.target == popupBox_3) {
        popupBox_3.style.display = "none";
    }
}

---

您没有绑定其他侦听器，您只是两次更改

窗口

对象的

.onclick

成员。您没有绑定其他侦听器，您只是两次更改

窗口

对象的

.onclick

成员。好的，谢谢，您能告诉我应该对此函数做些什么吗？我的意思是你把“//逻辑”放在那里？我开始编程，我是初学者嗨，奥利弗，没问题。我更新了我的答案，使之更具体。好的，谢谢，你能告诉我这个函数应该用什么吗？我的意思是你把“//逻辑”放在那里？我开始编程，我是初学者嗨，奥利弗，没问题。我更新了我的答案，使之更加具体