Javascript 事件触发后移除EventListner

我有一个脚本，它向div添加一个click事件以添加一个新元素。然后，该函数创建并添加元素，然后从Div中删除click，这样就不能再添加其他元素了。我理解removeEventListener为什么不工作，但我不知道如何修复它。下面是给我带来问题的代码行：

function enable_add(tag, type){return function(e){add_element(e, tag, type);};} //Function call for adding new elements  
document.getElementById("body_visual_editor").addEventListener("click", enable_add(tag, type));  
document.getElementById("body_visual_editor").removeEventListener("click", enable_add());  

firebug说函数（e）被指定为事件，而不是enable_add，因此remove事件找不到正确的事件。我如何写这三行，使它们都能正常工作？
请不要使用javascript库

更新：所以我把原稿改写成这样：

var handler;
function enable_add(tag, type) //Function call for adding new elements
{
    handler= function handler(e){add_element(e, tag, type);};
    return handler
}
document.getElementById("body_visual_editor").addEventListener("click", enable_add(tag, type));  
document.getElementById("body_visual_editor").removeEventListener("click", handler);   

但现在它在add_元素调用中创建一个元素来设置处理程序，并在单击时创建一个元素。如何修复此问题？

编辑、更新

尝试命名匿名函数，利用

函数.prototype.call（）

，

函数.prototype.bind（）

，

参数

，传递

此

，

事件

对象

var namedHandler；
功能启用\添加（标签、类型）{
namedHandler=函数namedHandler（）{
add_element.call（this，arguments[arguments.length-1]，tag，type）
}.bind（此、标签、类型）；
返回名称Handler
}
功能添加元素（e、标记、类型）{
var el=document.createElement（标记）；
el.setAttribute（“类型”，类型）；
文件.正文.附件（el）；
此.removeEventListener（“单击”，命名为Handler）
}
var elem=document.getElementById（“主体可视化编辑器”）；
元素添加列表（“单击”，启用添加调用（元素，“输入”，“文本”））

单击添加一个元素

编辑、更新

尝试命名匿名函数，利用

函数.prototype.call（）

，

函数.prototype.bind（）

，

参数

，传递

此

，

事件

对象

var namedHandler；
功能启用\添加（标签、类型）{
namedHandler=函数namedHandler（）{
add_element.call（this，arguments[arguments.length-1]，tag，type）
}.bind（此、标签、类型）；
返回名称Handler
}
功能添加元素（e、标记、类型）{
var el=document.createElement（标记）；
el.setAttribute（“类型”，类型）；
文件.正文.附件（el）；
此.removeEventListener（“单击”，命名为Handler）
}
var elem=document.getElementById（“主体可视化编辑器”）；
元素添加列表（“单击”，启用添加调用（元素，“输入”，“文本”））

---

单击以添加一个元素

再次调用该函数将创建一个新函数，因此无法使用。您必须将EventListener存储为变量，才能将其传递给removeEventListener。

再次调用该函数将创建一个新函数，因此无法工作。您必须将EventListener存储为变量，才能将其传递给removeEventListener。

问题在于：

function enable_add(tag, type){return function(e){add_element(e, tag, type);};} //Function call for adding new elements  
document.getElementById("body_visual_editor").addEventListener("click", enable_add(tag, type));  
document.getElementById("body_visual_editor").removeEventListener("click", enable_add());  

var myHandler = makeFunction();
el.addEventListener("click", myHandler);
el.removeEventListener("click", myHandler);

您已经得到了一个部分应用的函数，该函数将直接传递到

addEventListener

removeEventListener

仅在与传递给

addEventListener

的函数实例完全相同的函数实例上工作

因此，您的解决方案是将创建的函数缓存为引用，然后将其传递到addEventListener，记住它，并将其传递到removeEventListener

var myHandler = makeFunction();
el.addEventListener("click", myHandler);
el.removeEventListener("click", myHandler);

…当然，您可能不打算立即删除它。 这意味着你需要更具创造性

function handleEventOnce (evt, el, action) {
  function doSomething (e) {
    action(e);
    el.removeEventListener(evt, doSomething);
  }
  el.addEventListener(evt, doSomething);
}

handleEventOnce("click", button, somePartialFunction(a, b));

问题是：

function enable_add(tag, type){return function(e){add_element(e, tag, type);};} //Function call for adding new elements  
document.getElementById("body_visual_editor").addEventListener("click", enable_add(tag, type));  
document.getElementById("body_visual_editor").removeEventListener("click", enable_add());  

您已经得到了一个部分应用的函数，该函数将直接传递到

addEventListener

removeEventListener

仅在与传递给

addEventListener

的函数实例完全相同的函数实例上工作

因此，您的解决方案是将创建的函数缓存为引用，然后将其传递到addEventListener，记住它，并将其传递到removeEventListener

var myHandler = makeFunction();
el.addEventListener("click", myHandler);
el.removeEventListener("click", myHandler);

…当然，您可能不打算立即删除它。 这意味着你需要更具创造性

function handleEventOnce (evt, el, action) {
  function doSomething (e) {
    action(e);
    el.removeEventListener(evt, doSomething);
  }
  el.addEventListener(evt, doSomething);
}

handleEventOnce("click", button, somePartialFunction(a, b));

---

enable_edd应该返回侦听器函数。这个答案解决了问题。谢谢，我说得太快了。现在我有另一个问题。当我尝试设置处理程序变量时，它会运行add_element（）并创建一个空元素，然后单击创建第二个元素。我怎样才能阻止它？我将编辑我的答案以显示我的更改。@Zaper127在返回对

handler

handler=函数处理程序（e）{add_元素（e，标记，类型）；}的引用之前，请尝试调用
handler（）
；处理程序（e）；返回处理程序

uhhh此处没有理由指定外部变量。调用函数时只需执行赋值@刚刚创建第三个元素enable_edd的guest271314应该返回侦听器函数。这个答案解决了问题。谢谢，我说得太快了。现在我有另一个问题。当我尝试设置处理程序变量时，它会运行add_element（）并创建一个空元素，然后单击创建第二个元素。我怎样才能阻止它？我将编辑我的答案以显示我的更改。@Zaper127在返回对

handler

handler=函数处理程序（e）{add_元素（e，标记，类型）；}的引用之前，请尝试调用
handler（）
；处理程序（e）；返回处理程序

uhhh此处没有理由指定外部变量。调用函数时只需执行赋值@guest271314，它只会创建第三个元素