首页 > 解决方案 > JavaScript addEventListener 不适用于移动切换菜单

问题描述

此 JavaScript 代码不起作用。

    <div class="container">
        <div class="bar1"></div>
        <div class="bar2"></div>
        <div class="bar3"></div>
    </div>

let mobile = document.querySelector(".container");
mobile.addEventListener("click", myFunction);

function myFunction(x) {
    x.classList.toggle("change");
}

但是这段 JavaScript 代码运行良好。

    <div class="container" onclick="myFunction(this)">
        <div class="bar1"></div>
        <div class="bar2"></div>
        <div class="bar3"></div>
    </div>

function myFunction(x) {
    x.classList.toggle("change");
}

第一个代码有什么问题。请帮我解决这个问题。

标签: javascript

解决方案


Event 接口的target属性是对调度事件的对象的引用。event.target 属性可用于实现事件委托。当将同一个事件处理程序附加到多个元素时,使用 event.currentTarget 很有趣。

修改函数为→</p>

function myFunction(x) {
    x.currentTarget.classList.toggle("change");
}

推荐阅读