Javascript-事件侦听器切换按钮

我正在尝试创建一个按钮，它可以将“双击”切换为“单击”，反之亦然。由于某些原因，一旦切换到单击，它就无法返回。有人能帮忙吗

function init() {
    normal_listeners();
}

function addListener(){
    var image1 = document.getElementById('image_1');
    var image2 = document.getElementById('image_2');
    var image3 = document.getElementById('image_3');

    if(document.getElementById('listener_1').value == "Listener"){
        document.getElementById('listener_1').style.backgroundColor = "red";
        alert("Normal");

        image1.addEventListener("dblclick", function(){userChoice(1);}, false);
        image2.addEventListener("dblclick", function(){userChoice(2);}, false);
        image3.addEventListener("dblclick", function(){userChoice(3);}, false); 

        document.getElementById('listener_1').value = "Normal";
    } 
    else if(document.getElementById('listener_1').value == "Normal") {
        document.getElementById('listener_1').style.backgroundColor = "green";
        alert("Listener");

        image1.addEventListener("click", function(){userChoice(1);}, false);
        image2.addEventListener("click", function(){userChoice(2);}, false);
        image3.addEventListener("click", function(){userChoice(3);}, false);

       document.getElementById('listener_1').value = "Listener";
   }
}

function normal_listeners(){
    var image1 = document.getElementById('image_1');
    var image2 = document.getElementById('image_2');
    var image3 = document.getElementById('image_3');
    var listener1 = document.getElementById('listener_1');

    listener1.addEventListener("click", addListener, false);    
    image1.addEventListener("dblclick", function(){userChoice(1);}, false);
    image2.addEventListener("dblclick", function(){userChoice(2);}, false);
    image3.addEventListener("dblclick", function(){userChoice(3);}, false);
 }
 window.onload = init;

 <img id="image_1" src="rock.jpg" alt="ROCK" width="100" height="100">
 <img id="image_2" src="paper.jpg" alt="PAPER" width="100" height="100">
 <img id="image_3" src="scissors.jpg" alt="SCISSORS" width="100" height="100">
 <input type="button" id="listener_1" value="Normal" style="background-color:red"> 

函数init（）{
正常侦听器（）；
}
函数addListener（）{
var image1=document.getElementById（'image_1'）；
var image2=document.getElementById（'image_2'）；
var image3=document.getElementById（'image_3'）；
if（document.getElementById（'listener_1'）。value==“listener”）{
document.getElementById（'listener_1'）.style.backgroundColor=“red”；
警惕（“正常”）；
addEventListener（“dblclick”，function（）{userChoice（1）；}，false）；
image2.addEventListener（“dblclick”，function（）{userChoice（2）；}，false）；
image3.addEventListener（“dblclick”，function（）{userChoice（3）；}，false）；
document.getElementById（'listener_1'）。value=“Normal”；
} 
else if（document.getElementById（'listener_1'）。value==“Normal”）{
document.getElementById（'listener_1'）.style.backgroundColor=“绿色”；
警惕（“听众”）；
image1.addEventListener（“单击”，函数（）{userChoice（1）；}，false）；
image2.addEventListener（“单击”，函数（）{userChoice（2）；}，false）；
image3.addEventListener（“单击”，函数（）{userChoice（3）；}，false）；
document.getElementById（'listener_1'）。value=“listener”；
}
}
函数normal_侦听器（）{
var image1=document.getElementById（'image_1'）；
var image2=document.getElementById（'image_2'）；
var image3=document.getElementById（'image_3'）；
var listener1=document.getElementById（'listener_1'）；
listener1.addEventListener（“单击”，addListener，false）；
addEventListener（“dblclick”，function（）{userChoice（1）；}，false）；
image2.addEventListener（“dblclick”，function（）{userChoice（2）；}，false）；
image3.addEventListener（“dblclick”，function（）{userChoice（3）；}，false）；
}
window.onload=init；

我认为在添加新的事件侦听器之前，必须先删除这些事件侦听器。分配的单击侦听器可能会阻止双击侦听器的出现。

看起来像是打开按钮切换，您总是绑定事件，但不要取消绑定上一个。请注意此代码，如果在同一对象上的同一事件上有多个侦听器，则效果可能。。。好奇！