如何将一个或多个变量附加到一个事件侦听器?

cmp

我在if语句中有一个事件侦听器,以使菜单滑入。

const burger = document.querySelector(".c-brgr");

if (!menuOpen) {
    burger.addEventListener('click', function () {
      if (!menuOpen) {
        nav.classList.add("menu-is-open");
        menuOpen = true;
      } else {
        nav.classList.remove("menu-is-open");
        menuOpen = false;
      }
   });
}

单击HTML时,我还要在HTML中有一个div,以同时关闭菜单。我可以再做一个。

const closeArea = document.querySelector(".js-close-area");

if (!menuOpen) {
    closeArea.addEventListener('click', function () {
      if (!menuOpen) {
       // as above
      } else {
       // "
      }
   });
}

这次,我使用其他元素代替汉堡。closeArea但是,这将不必要地重复代码。

有没有一种方法可以只对其中一个使用if语句addEventListeners

打回来

是的,您可以将两者都添加到数组中,并按如下所示遍历它们

    const burger = document.querySelector(".c-brgr");
    const closeArea = document.querySelector(".js-close-area");

    if (!menuOpen) {
        [burger, closeArea].forEach(element => {
          element.addEventListener('click', function () {
             if (!menuOpen) {
               // as above
              } else {
                // "
              }
           });
        }
    }

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何将多个事件侦听器添加到一个按钮?

将多个事件侦听器添加到一个元素

一个类的多个事件侦听器

将事件侦听器添加到另一个文件

创建一个事件侦听器来侦听变量中的值是否已更改

Tcl:如何将多个变量附加到一行中,它们之间有一个空格?

Javascript 事件侦听器覆盖另一个事件侦听器

使用Handlebar.js模板将onclick事件侦听器添加到多个按钮中,只有最后一个有效

如何在一个元素中添加多个带有选择器的事件侦听器?

如何将变量附加到另一个变量名称?

如何将变量附加到for循环之外的另一个变量中?

多个 azure 队列的一个侦听器

useEffect 中的一个简单事件侦听器导致多个警告

一个按钮上的jFrame多个事件侦听器

如何将一个事件处理程序附加到 React JS 中的不同输入?

如何为从另一个类引发的事件创建事件侦听器

如何为多个函数调用删除一个函数中的所有事件侦听器?

如何通过 MainFrame 中的事件侦听器将 JPanel 作为组件添加到另一个类

Node.js Adonis:如何将多个控制器附加到一个 websocket 通道?

For 循环仅将数组的最后一个值分配给事件侦听器

将事件侦听器保留在列表的最后一个元素上

如何将div附加到变量内的另一个div中?

如何将多个文件的内容附加到一个文件中

如何将多个列表附加到python字典中的一个键?

如何将一个div附加到另一个div

如何将一个 std::queue 的内容附加到另一个

如何在事件侦听器上获取第一个 div 元素

如何为所有按钮添加一个事件侦听器

如何从Java中另一个类的事件侦听器中检索值?