简体   繁体   English

JavaScript显示警报消息

[英]JavaScript to Display Alert Message

So I'm trying to make my JavaScript Magic 8 ball display an alert(); 所以我试图让我的JavaScript Magic 8球显示一个alert(); message when the user already asked it once. 用户已经询问过一次时显示的消息。 I know I need an if/else statement, but not sure where to start. 我知道我需要一个if/else语句,但是不确定从哪里开始。 I have everything to display correctly when a question is asked. 提出问题时,我可以正常显示所有内容。 Just need the if/else statement. 只需要if/else语句。

 //Create an array for you responses. Remember, it's [0-14]. var responses = [ "Ask again later...", "Yes", "No", "It appears to be so.", "Reply is hazy, please try again.", "Yes, definitely.", "What is it you really want to know?", "Outlook is good.", "My sources say no.", "Signs point to yes.", "Don't count on it!", "Cannot predict now.", "As I see it, yes.", "Better not tell you now.", "Concentrate and ask again" ] //Create a variable for your user's input or question. var question; //Display the output. document.getElementById("submit").onclick = function() { question = responses[Math.floor(Math.random() * responses.length)]; document.getElementById("answer").innerHTML = question; }; 
 <h1>Magic 8 Ball</h1> <p>What would you like to know?</p> <input type="text" name="askme" placeholder="Enter a question..."> <br /> <br /> <button id="submit">Ask the 8 Ball</button> <br /> <br /> <h2>The 8 Ball says:</h2> <p id="answer"></p> 

If you want no duplicate questions 如果您不想重复的问题

What you need to do is set up another array (in my example, alreadyAsked ), and then every time you receive a particular question, push the question to that array. 您需要做的是设置另一个数组(在我的示例中, alreadyAsked ),然后每次您收到一个特定的问题时,将问题推送到该数组。

To grab the question asked, you need to target the element with question = document.getElementsByName('askme')[0].value; 要抓住提出的问题,您需要使用question = document.getElementsByName('askme')[0].value;定位元素question = document.getElementsByName('askme')[0].value; . The [0] is needed because document.getElementsByName() returns a NodeList collection of objects. 需要[0] ,因为document.getElementsByName()返回对象的NodeList集合。 Note that this declaration must occur inside of the click event, as the question will change after page load. 请注意,此声明必须在click事件内部发生,因为问题将在页面加载后发生变化。

Then simply check if the question is already in that secondary array with if (alreadyAsked.indexOf(question) >= 0) { } . 然后只需使用if (alreadyAsked.indexOf(question) >= 0) { }检查问题是否已在该辅助数组中。 Note that you'll need to push to the array after this check, or else the question will always be in the array! 请注意, 此检查之后 ,您将需要推送到数组,否则问题将始终存在于数组中!

Making use of a secondary array allows you to check if any question has been encountered before, not just the immediately preceding question (as would be the case with if (question) ). 利用辅助数组,您可以检查之前是否遇到过任何问题,而不仅仅是前一个问题(如if (question) )。

Your existing snippet defines the random answer selection as question , but I've changed this to be called answer (as that is what it actually is). 您现有的代码段将随机答案选择定义为question ,但我已将其更改为answer (实际上就是这样)。 I've called the user's input question . 我称呼用户的输入question Note that the `else condition has been updated to reflect this new naming convention. 请注意,`else条件已更新,以反映此新的命名约定。

 //Create an array for you responses. Remember, it's [0-14]. var responses = [ "Ask again later...", "Yes", "No", "It appears to be so.", "Reply is hazy, please try again.", "Yes, definitely.", "What is it you really want to know?", "Outlook is good.", "My sources say no.", "Signs point to yes.", "Don't count on it!", "Cannot predict now.", "As I see it, yes.", "Better not tell you now.", "Concentrate and ask again" ]; // Set up a secondary array for questions that have already been asked. var alreadyAsked = []; //Create a variable for your user's input or question. var question; //Display the output. document.getElementById("submit").onclick = function() { question = document.getElementsByName('askme')[0].value; answer = responses[Math.floor(Math.random() * responses.length)]; if (alreadyAsked.indexOf(question) >= 0) { alert('You attempted to say "' + question + '", but you already asked that!'); } else { document.getElementById("answer").innerHTML = answer; } alreadyAsked.push(question); }; 
 <h1>Magic 8 Ball</h1> <p>What would you like to know?</p> <input type="text" name="askme" placeholder="Enter a question..."> <br /> <br /> <button id="submit">Ask the 8 Ball</button> <br /> <br /> <h2>The 8 Ball says:</h2> <p id="answer"></p> 

If you want no duplicate answers 如果您不希望有重复的答案

What you need to do is set up another array (in my example, alreadyAnswered ), and then every time you receive a particular answer, push the answer to that array. 您需要做的是设置另一个数组(在我的示例中, alreadyAnswered ),然后每次收到特定答案时,将答案推入该数组。

Then simply check if the answer is already in that secondary array with if (alreadyAnswered.indexOf(question) >= 0) { } . 然后,只需使用if (alreadyAnswered.indexOf(question) >= 0) { }检查答案是否已在该辅助数组中。 Note that you'll need to push to the array after this check, or else the answer will always be in the array! 请注意, 此检查之后 ,您将需要推送到数组,否则答案将始终在数组中!

Making use of a secondary array allows you to check if any answer has been encountered before, not just the immediately preceding answer (as would be the case with if (question) ). 利用辅助数组,您可以检查之前是否遇到了任何答案,而不仅仅是前一个答案(如if (question) )。

 //Create an array for you responses. Remember, it's [0-14]. var responses = [ "Ask again later...", "Yes", "No", "It appears to be so.", "Reply is hazy, please try again.", "Yes, definitely.", "What is it you really want to know?", "Outlook is good.", "My sources say no.", "Signs point to yes.", "Don't count on it!", "Cannot predict now.", "As I see it, yes.", "Better not tell you now.", "Concentrate and ask again" ]; // Set up a secondary array for answers that have already been given. var alreadyAnswered = []; //Create a variable for your user's input or question. var question; //Display the output. document.getElementById("submit").onclick = function() { question = responses[Math.floor(Math.random() * responses.length)]; if (alreadyAnswered.indexOf(question) >= 0) { alert('I attempted to say "' + question + '", but I already answered that!'); } else { document.getElementById("answer").innerHTML = question; } alreadyAnswered.push(question); }; 
 <h1>Magic 8 Ball</h1> <p>What would you like to know?</p> <input type="text" name="askme" placeholder="Enter a question..."> <br /> <br /> <button id="submit">Ask the 8 Ball</button> <br /> <br /> <h2>The 8 Ball says:</h2> <p id="answer"></p> 

Hope this helps! 希望这可以帮助! :) :)

if (question) {
  alert("already asked");
} else {
  // existing logic here
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM