作者:200433 | 来源:互联网 | 2023-01-13 12:10
如何解决《为什么这相当于"on.("click",function)[..]"即使用纯JavaScript编写也能自动触发点击?》经验,为你挑选了1个好方法。
这段代码:
var el = $(".threeLines");
el.on("click", function(){
$(this).toggleClass("active");
});
帮助我在click事件上添加"active"类,以在菜单图标上创建一个很好的效果,如下所示:
我将代码重写为纯JS,如下所示:
function test_xz(s) {
s.classList.add("active")
}
var el_cOntainer= document.getElementsByClassName("threeLines")[0];
el_container.addEventListener("click", test_xz(el_container));
但是当文档准备就绪时它会立即触发,它完全像这样混乱:
我理解这一点jQuery's "$" corresponds to querySelector
,但我也尝试过,但它没有用.
经过一些研究(删除可能相关的所有其他功能,记录所有内容)后,我得出结论,有问题的行就是它addEventListener
本身,我写道:
el_container.addEventListener("click", console.log("Hey!"));
它只会记录"嘿!" 在页面加载.
我怎样才能做到这一点?
1> Phani Kumar ..:
在下面的行中,您test_xz
使用参数调用方法.
el_container.addEventListener("click", test_xz(el_container));
相反,更改为以下(不更改函数定义test_xz
):
el_container.addEventListener("click", function(){
test_xz (el_container);
});
要切换活动类:
function test_xz(s) {
s.classList.toggle("active");
}
在你的问题中,你提到过jQuery's "$" corresponds to querySelector
,我认为不是.$
只是另一个名称(别名),jQuery
而()
后面的内容$
是选择器.