如何在 EventListener 内部的函数中添加参数？

Question

我的想法是用 vanila JS 编写一个计算器，但我遇到了一个问题。我想通过绑定键来解决它，并分别为它们中的每一个添加事件监听器。为了不重复我的代码，我想创建一个可以做所有事情的函数，我只添加一个键号作为参数。当我运行代码时，它会立即触发该函数，而无需单击 "number two" 。我知道，问题出在“点击”，getInput（二），我想让这个功能工作。有任何想法吗？let input = document.getElementById("input").innerHTML;const plus = document.querySelector(".plus");const minus = document.querySelector(".minus");const one = document.querySelector(".one");const two = document.querySelector(".two");const three = document.querySelector(".three");const four = document.querySelector(".four");const five = document.querySelector(".five");const six = document.querySelector(".six");const seven = document.querySelector(".seven");const eight = document.querySelector(".eight");const nine = document.querySelector(".nine");const ac = document.querySelector(".ac");function getInput(number){    console.log("i am here");    console.log(number.textContent);    if (input === 0){        input = number.textContent;        document.getElementById("input").innerHTML = input;    }    else{        input += number.textContent;        document.getElementById("input").innerHTML = input;    }}two.addEventListener("click",getInput(two));ac.addEventListener("click",() =>{   input = 0;   console.log(input);   document.getElementById("input").innerHTML = input;})plus.addEventListener("click",() => {    console.log(plus.textContent);    input += plus.textContent;    document.getElementById("input").innerHTML= input;});one.addEventListener("click",()=>{    if (input === 0) {        input = one.textContent;        document.getElementById("input").innerHTML=input;    }    else {    input += one.textContent;    document.getElementById("input").innerHTML=input;    }})第二个问题，有没有更简单的方法通过不绑定每个键来检测用户的输入？（我是 JS 新手，这对我有很大帮助）

Answer 1

要在事件侦听器中触发带有参数的函数，您需要在事件侦听器中创建一个函数，该函数使用参数执行您的函数：

btn.addEventListener("click", () => { yourFunction(parameter) });

要统一事件绑定，您可以执行以下操作：

const numberBtns = document.querySelectorAll(".number-btns");

numberBtns.forEach( btn => btn.addEventListener(....));

要获取您按下的数字，您可以使用数据集或参考按钮的值：

<button data-number="1" class="number-btns" value="1">

// JS:

btn.dataset.number // = 1

btn.value // = 1