Jqueryクリックコールバック関数から壊れる方法

Question

私は自分のバージョンのsimon Gameを作っていますが、間違った入力を押した後、クリック内のコールバック関数は存在しません。その結果、関数handler.patternRepeatPlayer（）は、配列patternの各要素に対して再帰的に呼び出されています.handler.patternRepeatPlayerを1回呼び出した後に、elseから破棄するソリューションが必要です。プログラムはstrictモードで正常に動作していますが、他のモードでは非strictモードでしか動作しません。 - Gitでプロジェクトにアクセスできます。 https://github.com/santosh1357/simonGame.gitフローは、HTMLからのようである - > PatternGenからsimonnGame.PatternGen機能 - > handler.PatternRepeatPlayer - > PatternRepPlayer - > PatternMatcher - >ユーザ入力（ここでは非厳密モードで間違ったユーザ入力場合） - > patternRepeatPlayer このケースでありますこの場合のように失敗するのは、関数を1回だけ呼び出した後に他のものが存在しないことです。

//問題のある関数。

userInput: function(){ 
     var userPattern = new Array();var id; 
     $('img').click(function(){      
       id = parseInt(this.id,10); userPattern.push(id);handler.effect(id); 
       if(userPattern.indexOf(id) !== simonGame.PATTERN.indexOf(id)){ 
        if($('.chkStrict:checked').val() === "on"){ 
         var audio = new Audio('sounds/wrong.mp3'); 
         audio.play(); 
         setTimeout(function(){window.location.reload(true)},1000); 
        } else { 
         var audio = new Audio('sounds/wrong.mp3'); 
         audio.play(); 
         userPattern.length = 0; 
         handler.repeatFlag = true; 
         handler.patternRepeatPlayer(); ****//this is getting called recursivelly rather than quiting after calling once**** 
         return ; 
        } 
       } 

//エンド問題のFunctiom

私はコールバック関数の作業をクリック方法についていくつかの誤解があると思います。

// Fullcode

var simonGame = { 
    COUNT: 0, 
    PATTERN: [], 
    SOUND:[{file:'sounds/sa.mp3'},{file:'sounds/re.mp3'},{file:'sounds/ga.mp3'},{file:'sounds/ma.mp3'},{file:'sounds/pa.mp3'},{file:'sounds/dha.mp3'},{file:'sounds/nee.mp3'}], 
    patternGen: function(){ 
     var randomId; 
     randomId = Math.floor(Math.random() * 7); 
     simonGame.PATTERN.push(randomId); 
     if(simonGame.COUNT > 20){ 
      alert("You have won the game!!"); 
      window.location.reload(true); 
     } 
     simonGame.COUNT += 1; 
     //debugger; 
     //console.log("increase count true calling count display " + simonGame.COUNT); 
     handler.countDisplay(); 
     //console.log("count gen true calling patternPlayer with PATTERN " + simonGame.PATTERN); 
     handler.patternRepeatPlayer(); 
    }, //close patternGen 
    patternMatcher: function(genPattern){ 
     //console.log("inside patternMatch"); 
     var genPattern = simonGame.patternGen; 
     //setTimeout(function(){ 
      //console.log("PATEERN: " + simonGame.PATTERN + "COUNT " + simonGame.COUNT); 
      //calling user input 
      console.log("calling user Input"); 
      handler.userInput(); 
      setTimeout(function(){ 
       if(handler.repeatFlag === false){ //execute count gen only if repeat flag is false inside user INPUT 
        genPattern(); 
       } 
      },simonGame.COUNT*2000); 

      //console.log("pattern check true, calling pattern gen"); 

     //},simonGame.COUNT*5000); //c`enter code here`lose setTimeout 

    }, //close patternMatcher 



} //close simonGame 

var handler = { 
    countRepPlayer: 0, 
    repeatFlag: false, 
    patternRepeatPlayer: function(){ 
     var repeater = setInterval(function(){ 
       handler.effect(simonGame.PATTERN[handler.countRepPlayer]); 
       handler.countRepPlayer += 1; 
       if(handler.countRepPlayer > simonGame.COUNT){ 
        clearInterval(repeater); 
        //setTimeout(function(){ 
         simonGame.patternMatcher(); 
         //},1000); 
        handler.countRepPlayer = 0; 
       } 
      },1000);//close sestInterval 

    }, //close patternRepeatPlayer 
    effect: function(id){ 
     var img = document.getElementById(id); 
     if(img !== null && id !== undefined){ 
      $(img).fadeIn(100).fadeOut(100).fadeIn(100);//fadeOut(200).fadeIn(200); 
      //debugger; 
      var audio = new Audio(simonGame.SOUND[id].file); 
      audio.play(); 
      //console.log("id inside effect " + id) 
     } 
    },//close effect 
    countDisplay: function(){ 
     document.getElementById("count").innerHTML = "Count: " + simonGame.COUNT; 
    }, //close countIncrease 
    userInput: function(){ 
     var userPattern = new Array();var id; 
     $('img').click(function(){      
       id = parseInt(this.id,10); 
       userPattern.push(id); 
       handler.effect(id); 
       console.log(" user " + userPattern); 
       console.log(" pattern " + simonGame.PATTERN); 
       if(userPattern.indexOf(id) !== simonGame.PATTERN.indexOf(id)){ 
        console.log(" WRONG USER INPUT "); 
        if($('.chkStrict:checked').val() === "on"){ 
         var audio = new Audio('sounds/wrong.mp3'); 
         audio.play(); 
         setTimeout(function(){window.location.reload(true)},1000); 
        } else { 
         console.log("inside else "); 
         var audio = new Audio('sounds/wrong.mp3'); 
         audio.play(); 
         userPattern.length = 0; 
         handler.repeatFlag = true; 
         handler.patternRepeatPlayer(); ****//this is getting called recursivelly rather than quiting after calling once**.** 
         return ; 
        } 
       } 
       //reset the userPattern Array 
       if(userPattern.length === simonGame.PATTERN.length){ 
        userPattern.length = 0; 
       } 
     });  //close click. 

    } 


} //close handler 

Answer 1

あなたはそれのための間隔を設定するのではい、それは、再帰的に呼び出されます。
ここでは、あなたのコードを変更することができます。

patternRepeatPlayer: function(){ 
    var repeater = setInterval(function(){ 
      handler.effect(simonGame.PATTERN[handler.countRepPlayer]); 
      handler.countRepPlayer += 1; 
      if(handler.countRepPlayer > simonGame.COUNT){ 
       clearInterval(repeater); 
       //setTimeout(function(){ 
        simonGame.patternMatcher(); 
        //},1000); 
       handler.countRepPlayer = 0; 
      } 
     },1000);//close sestInterval 

} 

へ：（編集）

function myCallbackFunction(repeater){ 
    handler.effect(simonGame.PATTERN[handler.countRepPlayer]); 
    handler.countRepPlayer += 1; 
    if(handler.countRepPlayer > simonGame.COUNT){ 
    clearInterval(repeater); 
    simonGame.patternMatcher(); 
    handler.countRepPlayer = 0; 
    } 
} 

patternRepeatPlayer: function(){ 
    var repeater = setInterval(function() {myCallbackFunction(repeater);}, 1000); 
} 

そして、あなたは一度それを呼び出す必要があり、ちょうどmyCallbackFunction(repeater)