0

「ダブルクリック」を「シングルクリック」に、またはその逆に切り替えることができるボタンを作成しようとしています。何らかの理由で、シングルクリックに切り替えると、元に戻すことができません。誰でも助けてもらえますか？

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">
4

1 に答える 1

0

新しいリスナーを追加する前に、イベントリスナーを削除する必要があると思います。割り当てられたクリック リスナーによって、ダブルクリック リスナーが発生しない場合があります。

于 2013-07-03T11:04:34.307 に答える