2017-08-30 4 views
1

グローバルなvarまたはそれらの関数外のvarを宣言することなく、showResult関数にcurrentQuest.optionsを渡す必要があります。グローバルなvarまたはvarを外部関数を使用せずに関数間でjquery pass var

可能ですか?私は他の同様の質問を読んだが、すべての正解はグローバル変数を使用しています。

var pool = { 
     q1: { 
      question: "This is question number 1", 
      options: ["Option 1", "Option 2", "Option 3", "Option 4"], 
      answer: 0, //answer uses property option key 
      used: false 
     }, 
     q2: { 
      /*...*/ 
     }, 
     /*...just more q here...*/ 
    } 

    //choose a random question 
    function randomQuest(obj) { 
     var keys = Object.keys(obj); 
     return obj[keys[keys.length * Math.random() << 0]]; 
    } 

    //show question and options 
    function showQuest() { 
     var currentQuest = randomQuest(pool); 
     $(".answer").html(""); //clear old answer 
     $(".question").html(currentQuest.question); 
     $(".options").html(currentQuest.options); 
     currentQuest.used = true; //mark question used 

     console.log(currentQuest.question); 
     console.log("used? ", currentQuest.used); 
    } 

    function showResult() { 
     $(".question").html(""); 
     $(".options").html(""); 
     var x = currentQuest.answer; 
     $(".answer").html("Here is the answer " + currentQuest.options[x]); //how to pass currentQuest here? 
    } 

    function timer() { 
     var seconds = 4; 
     var interval = setInterval(function() { 
      seconds--; 
      $(".timer").html("<p>Time remaining: " + seconds + " s</p>");  
      if (seconds == 0) { 
       clearInterval(interval); 
       showResult(); 
      } 
     }, 1000); 
    } 

    //when click start game 
    $(".btn").on("click", function() { 
     timer(); 
     showQuest(); 
    }); 

ロジックは次のとおりです。ボタンがクリックされたとき - >、タイマーを開始タイマーが0に当たったとき(ランダムプールから選択される)最初の質問 を示し、ショーの結果、数秒待って、タイマーをリセットし、を表示します別の質問、タイマーをもう一度開始します。

答えて

3

これを実現するには、関数パラメータを使用できます。

function showQuest(currentQuest) { 
    $(".answer").html(""); //clear old answer 
    $(".question").html(currentQuest.question); 
    $(".options").html(currentQuest.options); 
    currentQuest.used = true; //mark question used 

    console.log(currentQuest.question); 
    console.log("used? ", currentQuest.used); 
} 

function showResult(currentQuest) { 
    $(".question").html(""); 
    $(".options").html(""); 
    var x = currentQuest.answer; 
    $(".answer").html("Here is the answer " + currentQuest.options[x]); //how to pass currentQuest here? 
} 

function timer(currentQuest) { 
    var seconds = 4; 
    var interval = setInterval(function() { 
     seconds--; 
     $(".timer").html("<p>Time remaining: " + seconds + " s</p>");  
     if (seconds == 0) { 
      clearInterval(interval); 
      showResult(currentQuest); 
     } 
    }, 1000); 
} 

//when click start game 
$(".btn").on("click", function() { 
    var currentQuest = randomQuest(pool); 
    timer(currentQuest); 
    showQuest(currentQuest); 
}); 

編集:ランダムインデックスを取得するには、このメソッドをお試しください。

// From MDN 
function getRandomInt(min, max) { 
    min = Math.ceil(min); 
    max = Math.floor(max); 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
} 

function randomQuest(obj) { 
    var keys = Object.keys(obj); 
    return obj[keys[getRandomInt(0, keys.length)]]; 
} 
+0

Ghasan Al-Sakkafありがとうございます。しかし、これは、タイマーが0になった後に質問がランダムに生成されないことを意味します。ボタンがクリックされたときに初めて動作します。 – Viet

+0

@vietnguyen、更新された答えを確認してください。 –

+0

ガッサン・アル・サッカフありがとう!ちなみに、私はプールからランダムな質問をどのように生成することができますが、使用された質問は再び選択されませんか? – Viet

関連する問題