Javascript 文档上的EventListener（'click'）阻止其他（'click'）工作

我想关闭一个包含许多元素的搜索菜单，方法是单击它的外部。为此，我制作了一个onclick函数来打开/关闭它，其中包含一个可以工作的链接，以及一个onclick函数来检测并关闭它外部的clics。问题是，我的第一个函数是独立工作的，但当我放置第二个函数时，什么都不起作用。这就是我到目前为止得到的：

document.getElementById('link').addEventListener('click', function(e) {
            menuframe = document.getElementsByClassName('searchframe')[0];
            e.preventDefault(); // On bloque l'action par défaut de cet événement
            if (!menuframe.classList.contains('displayed')) {
                menuframe.classList.add('displayed');
            } else {
                menuframe.classList.remove('displayed');
                link.blur(); }
        }, false);

        document.getElementById('all').addEventListener('click', function (e) {
            var x = document.getElementById.e.target.id,
                menuframe = document.getElementsByClassName('searchframe')[0];
            if (menuframe.classList.contains('displayed') && !menuframe.contains(x))
                menuframe.classList.remove('displayed'); }
        }, false);

我认为这与事件冒泡/捕获有关，试图弄乱真/假和e.stopPropagation；没有成功。或者我的代码不好，我是JS的新手。我试着用谷歌搜索我能想到的所有东西，并尝试了各种我发现的“修复”，但都没有成功

总而言之，在单击外部时，如何关闭div？如果可能的话，如果没有jQuery，我根本不知道语法

---

编辑：在第14行的“if”之后添加“{”，并按照Jameel的建议通过var x=document.getElementByIde.target.id更改了第12行。现在e.preventDefault在第1个函数上工作，但仍然是这样。

您需要将e.target.id传递给document.getElementById方法，如下所示：

 var x = document.getElementById(e.target.id)

---

您是否检查了javascript控制台是否有错误？

根据您提出的问题，请参见下文，我假设您的第一次单击打开/显示了一个新层。新元素是否可能与您所谓的外部元素重叠，从而使其永远不会收到第二次单击？您可以尝试将区域着色，以检查是否有重叠，或者使用浏览器的调试工具

总而言之，在单击外部时，如何关闭div

---

如您所说更改了x的值，并检查了控制台日志；我忘记了一个{after if。修复了这个问题，现在当我单击“link”时，重定向被阻止，但没有发生任何其他情况。控制台现在告诉我getPreventDefault的用法已被弃用。[jQuery min]我不使用哪个？getUserData或setUserData的使用是不推荐的。我在代码中没有看到，你能指出这个错误是从哪里来的吗？getPreventDefault由jQuery方法preventDefault使用。不知道getUserData或setUserData完全错过了{关于if-抱歉。可能是一个愚蠢的问题，但是您的页面中是否有id=all的元素，或者您是否正在尝试将eventlistener添加到所有元素中？是的，我有一个div，都在我的下方，在某个时候只是编写文档。getElementById不起作用，所以我尝试解决它；我想不是很干净，但是如果我替换m，它会起作用带有alertx的y函数；我的控制台只返回警告，没有错误。如果我像控制台所建议的那样将“preventDefault”替换为“defaultPrevented”，它就不起作用了，我的链接仍然是一个链接。无论如何，我不认为preventDefault是问题所在，因为如果我只运行第一个函数，它就可以正常工作。当添加第二个侦听器“click”时，它就是w当问题开始出现时。我必须承认我的核心JS已经相当生疏了，因为我现在倾向于使用jQuery，但是为什么不从第二个事件侦听器中删除&！menuframe.containsx，而是添加一个第三个单击事件侦听器，它不会传播搜索菜单中的项目。我可以看到您正在尝试执行的操作，但我认为这可能更符合逻辑将包含的元素和容器元素分开处理。您可以做的另一件事是将console.log调用放入代码中，以查看单击元素时实际发生的情况。抱歉，这帮不了什么忙。第一次单击确实显示了一个新层，方法是将CSS中的可见性：hidden；更改为可见性：visible；这是迄今为止z索引最高的层我不知道你所说的“重叠”是否就是这个意思。新显示的内容包含在我的整个网站中，包括了页边空白，所以我认为第二个功能可以工作……我错了吗？嗯，你能提供一个你的问题吗？我看你的js代码没有问题。我的代码有点特别y css所以我对它进行了修剪，只显示了文档的结构和menuframe的css。我所有的JS都在元素之间，这真的很糟糕吗？第一个函数本身工作正常。告诉我它是否有帮助，或者我是否应该添加更多信息