如何使用removeEventListener移除带参数的事件处理函数？

你绑定事件时用的是匿名函数，之后移除事件时写的function(){grab(btn.innerText)}是另一个全新的匿名函数。JS里判断函数是否匹配看的是内存引用，不是代码内容，所以removeEventListener找不到之前绑定的那个函数，自然失效。

方法1：保存函数引用，用同一函数绑定/移除 #

把事件处理函数存成变量，确保绑定和移除用的是同一个引用：

// 定义共用的事件处理函数
function handleBtnClick() {
  grab(this.innerText); // 用this获取当前点击的按钮内容
}

// 给所有按钮绑定事件
document.querySelectorAll('button').forEach(btn => {
  btn.addEventListener("click", handleBtnClick);
});

// 移除指定按钮的事件
document.getElementById("testd").removeEventListener('click', handleBtnClick);

// 给testd绑定新事件
document.getElementById("testd").addEventListener("click", Track);

function grab(val) {
  document.getElementById("test1").innerText = Number(val);
  document.getElementById("test2").innerText = Number(val)+1;
  document.getElementById("test3").innerText = Number(val)+2;    
}

function Track() {
  console.log("Hello");
}

方法2：一开始就跳过不需要的按钮（更高效） #

既然<和>按钮不需要grab事件，直接在绑定阶段就跳过它们，省得事后移除：

document.querySelectorAll('button').forEach(btn => {
  // 只给非翻页按钮绑定grab事件
  if (btn.innerText !== '<' && btn.innerText !== '>') {
    btn.addEventListener("click", function(){grab(btn.innerText)});
  }
});

// 直接给翻页按钮绑定Track事件
document.getElementById("testd").addEventListener("click", Track);

function grab(val) {
  document.getElementById("test1").innerText = Number(val);
  document.getElementById("test2").innerText = Number(val)+1;
  document.getElementById("test3").innerText = Number(val)+2;    
}

function Track() {
  console.log("Hello");
}

方法3：用事件委托（推荐） #

把事件绑定在按钮的父容器上，通过判断目标元素类型和内容来处理逻辑，不用给每个按钮单独绑定，也无需手动移除：

// 假设按钮的父容器id为pageBtnContainer
document.getElementById("pageBtnContainer").addEventListener("click", function(e) {
  const targetBtn = e.target;
  if (targetBtn.tagName !== 'BUTTON') return;

  // 判断是翻页按钮还是页码按钮，分别处理
  if (targetBtn.innerText === '<' || targetBtn.innerText === '>') {
    Track();
  } else {
    grab(targetBtn.innerText);
  }
});

function grab(val) {
  document.getElementById("test1").innerText = Number(val);
  document.getElementById("test2").innerText = Number(val)+1;
  document.getElementById("test3").innerText = Number(val)+2;    
}

function Track() {
  console.log("Hello");
}

内容的提问来源于stack exchange，提问作者Brijesh Roy