addEventListener “click” 在 ejs 文件中没有响应答案

【问题标题】：addEventListener "click" is not responding in ejs fileaddEventListener “click” 在 ejs 文件中没有响应
【发布时间】：2019-02-19 18:23:11
【问题描述】：

header.ejs

页脚.ejs

delicacies.ejs

购物车.js

我正在尝试使元素（“span.cartcount”）在 CSS 文件中设置为 display: none 时显示。当我单击 addtocart 按钮 (a.addtocartbutton) 时应该显示它。

如果我可以使用 express.js 获取路线或使用购物车系统的替代方法，我也会很高兴

谢谢。

【问题讨论】：

请添加您的代码，而不是您的代码图片

标签： javascript node.js express onclick ejs

【解决方案1】：

document.querySelector() 只返回匹配选择器的第一个元素。您有一个创建多个项目的foreach() 循环，您需要将事件侦听器添加到所有项目。所以你需要使用document.querySelectorAll() 并循环它们。

let addToCartButtons = document.querySelectorAll("a.addtocartbutton");
let cartCount = document.querySelector("span.cartcount");

addToCartButtons.forEach(btn => btn.addEventListener("click", (event) => {
    event.preventDefault();
    cartCount.style.display = "inline";
}));

【讨论】：

巴尔玛，非常感谢。这是正确的答案。它对我有用。我使用“span.cartcount”而不是“a.cartcount”。我已经有一段时间了。我现在明白了要点，必须遍历所有“addtocartbuttons”。使用“document.querySelectorAll”也是关键。谢谢先生。