作爲迴應從JS數組中挑選的隨機句子

Question

首先，讓我解釋一下我的代碼。我創造了一個遊戲，當你「捅」這個怪物時，它會產生一個1到100之間的隨機數。如果這個隨機數等於5，那麼你贏了，如果不是，它說你已經死了，一個計時器會持續2秒，然後刷新頁面，讓您再次「戳」。它只用了一個句子的回覆，但爲了加強它，我想添加一個可能的死亡句子數組，這樣當你點擊圖片而你鬆了，那麼其中一個句子被隨機挑選出來，那就是迴應。

我的JS代碼：

var myTimer; 
//Timer that reloads the page 
function myTimerF() { 
    var x = document.getElementById("Button"); 
    x.innerHTML = "<img src='poke.png' >"; 
    clearInterval(myTimer); 
} 

//generates a random number then checks if you won or not 
function randomNumber() { 
    var res = Math.floor((Math.random() * 100) + 1); 

    var x = document.getElementById("Button") 
    if (res == 5) 
     x.innerHTML = "Winner! YOU ACTUALLY WON! IT'S A MIRICALE!"; 
    else 

    function getRandomSentence() { 
     var index = Math.floor(Math.random() * (maxSentences - 1)); 
     return sentences[index]; 
    } 

    myTimer = setInterval(function() { 
     myTimerF() 
    }, 2000); 
} 
//Random death sentences 
var sentences = [ 
    'You just got eaten! Try again in 2 seconds.', 
    'You are currently being digested. Try again in 2 seconds.', 
    'You have been incinerated, you may poke the monster in 2 seconds again.', 
    'Your head has been removed from your body, try again in 2 seconds when we find it.', 
    'You have been neautrilized. Try again in 2 seconds.', 
    'You ran away out of fear. Try again in 2 seconds.', 
    'Your legs are currently in the belly of the monster, try again in 2 seconds.' 
], 
maxSentences = sentences.length; 

我的HTML代碼：

<p id="Button" onclick="randomNumber()"> 
    <img src="poke.png" > 
</p> 

我的問題是隨機排列不工作。當你點擊圖像按鈕時，沒有任何反應。

Answer 1

我將getRandomSentence()函數從else聲明中移出並放在其他函數的下面。該函數甚至沒有被調用，所以我將函數調用添加到else語句中。我改變了你的setInterval爲setTimeout，因爲它只需要被調用一次（setInterval的用於重複間隔的setTimeout只被觸發一次。）

//Timer that reloads the page 
function myTimerF() { 
    var x = document.getElementById("Button"); 
    x.innerHTML = "<img src='poke.png' >"; 
} 

//generates a random number then checks if you won or not 
function randomNumber() { 
    var res = Math.floor((Math.random() * 100) + 1); 

    var x = document.getElementById("Button") 
    if (res == 5) 
     x.innerHTML = "Winner! YOU ACTUALLY WON! IT'S A MIRICALE!"; 
    else { 
     x.innerHTML = getRandomSentence(); 
     myTimer = setTimeout(myTimerF, 2000); 
    } 
} 

function getRandomSentence() { 
    var index = Math.floor(Math.random() * (maxSentences - 1)); 
    return sentences[index]; 
} 

//Random death sentences 
var sentences = [ 
    'You just got eaten! Try again in 2 seconds.', 
    'You are currently being digested. Try again in 2 seconds.', 
    'You have been incinerated, you may poke the monster in 2 seconds again.', 
    'Your head has been removed from your body, try again in 2 seconds when we find it.', 
    'You have been neautrilized. Try again in 2 seconds.', 
    'You ran away out of fear. Try again in 2 seconds.', 
    'Your legs are currently in the belly of the monster, try again in 2 seconds.' 
], 
maxSentences = sentences.length; 

Answer 2

在這裏，你走了，我把它做成了的jsfiddle的作品正確：test it out

聲明所有的變量向上頂（他們得到反正懸掛）：

var myTimer, 
    x = document.getElementById("button"), 
    sentences = [ //Random death sentences 
      'You just got eaten! Try again in 2 seconds.', 
      'You are currently being digested. Try again in 2 seconds.', 
      'You have been incinerated, you may poke the monster in 2 seconds again.', 
      'Your head has been removed from your body, try again in 2 seconds when we find it.', 
      'You have been neutralized. Try again in 2 seconds.', 
      'You ran away out of fear. Try again in 2 seconds.', 
      'Your legs are currently in the belly of the monster, try again in 2 seconds.' 
     ], 
    maxSentences = sentences.length; 

添加了一個事件偵聽器：

x.addEventListener('click', randomNumber, false); 

這是你的計時器。我們叫它馬上初始化代碼：

//Timer that reloads the page 
function myTimerF() { 
    x.innerHTML = "<img src='http://lorempixel.com/640/480/abstract/' >"; 
    clearInterval(myTimer); 
} 

myTimerF(); 

最後兩個其它功能，你需要：

//Produces random sentence, obviously 
function getRandomSentence() { 
    var index = Math.floor(Math.random() * (maxSentences - 1)), 
     randoSen = sentences[index]; 
    console.log('rando sentence #: ' + index); 
    x.innerHTML = randoSen; 
} 

//generates a random number then checks if you won or not 
function randomNumber() { 
    var res = Math.floor((Math.random()*100)+1); 
    console.log('random number 1 - 100 is: ' + res); 
    if (res == 5) { 
     x.innerHTML = "Winner! YOU ACTUALLY WON! IT'S A MIRICALE!"; 
    } else { getRandomSentence(); } 

    myTimer=setInterval(function(){myTimerF()},2000); 
}