作为回应从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); 
}