javascript中的ON/OFF事件监听器切换元素显示[重复]答案

【问题标题】：ON/OFF Event listener in javascript that toggles an element display [duplicate]javascript中的ON/OFF事件监听器切换元素显示[重复]
【发布时间】：2019-11-13 07:32:35
【问题描述】：

我很难找到如何添加 removeEventListener()。当我添加 addEventListener() 时效果很好，但是当我添加 removeEventListner 以便能够删除我在地图上的数据时它不起作用。（我用的是传单）

这是我的做法：

var geodata ={{{jsonData}}};

var bouto = document.getElementById("bouton");

function jsoncalls(){
    L.geoJSON(geodata,{
    onEachFeature: onEachFeature
}).addTo(mymap);
}

bouto.addEventListener("click", jsoncalls);
bouto.removeEventListener("click", jsoncalls);

谢谢

【问题讨论】：

你到底想在这里做什么？当您调用removeEventListener 时，它会删除您刚刚从addEventListener 添加的click 处理程序。
好吧，您只是删除了一个事件侦听器，因此当您的按钮被点击时，您将不会收到任何对 jsoncalls 方法的调用。如果您也可以删除它，请查看您用于添加数据的库（随意添加标签，在您的帖子中使用edit）
您应该使用正确的标题编辑问题，并更清楚地说明您希望 geoJSON 结果出现/消失。这与删除事件侦听器无关......！！！

标签： javascript html css

【解决方案1】：

看起来您立即删除了事件侦听器。调用事件后尝试将其删除。

var geodata = {{{jsonData}}}; // <- noting this is unusual. guessing its sudo code

var bouto = document.getElementById("bouton");
var displayElement = document.getElementById("display"); // whatever your display data element is

function jsoncalls() {
    // I'm assuming you want to remove it after jsoncall() is called.
    bouto.removeEventListener("click", jsoncalls);
    bouto.addEventListener("click", hideData);

    L.geoJSON(geodata, {
        onEachFeature: onEachFeature
      })
      .addTo(mymap);

    // show your display element here
    displayElement.style.display = "block";
}

function hideData() {
    bouto.removeEventListener("click", hideData);
    bouto.addEventListener("click", jsoncalls);

    // hide your display element here
    displayElement.style.display = "none";
}

bouto.addEventListener("click", jsoncalls);

这是一个更新的 jsfiddle，它会在奇数点击时显示元素并在偶数点击时隐藏。 https://jsfiddle.net/gmbnrx2q/

【讨论】：

您好，谢谢，但没有成功
你用的是什么浏览器？
谷歌浏览器，我正在使用传单库（映射库）。
它在什么方面不起作用？您不想在单击事件后将其删除吗？
是的，我希望它像切换开关一样工作（如果我们第一次单击数据显示，如果我们第二次单击数据消失等等（出现/消失））