简体   繁体   English

每次使用 javascript 和 jquery 单击按钮时更改文本

[英]change text every time button clicked with javascript and jquery

I have a list of quotes and every time I click the button I want it to go to a new quote.我有一个报价列表,每次单击该按钮时,我都希望将其 go 转换为新报价。 Can someone please explain what's wrong here and how I should fix it?有人可以解释一下这里出了什么问题以及我应该如何解决它?

 function myLost() { var quotes = new Array(); var nextQuote = 0; quotes[0] = "Don't be so humble - you are not that great."; quotes[1] = "Moral indignation is jealousy with a halo."; quotes[2] = "Glory is fleeting, but obscurity is forever."; quotes[3] = "The fundamental cause of trouble in the world is that the stupid are cocksure while the intelligent are full of doubt."; quotes[4] = "Victory goes to the player who makes the next-to-last mistake."; quotes[5] = "His ignorance is encyclopedic"; quotes[6] = "If a man does his best, what else is there?"; quotes[7] = "Political correctness is tyranny with manners."; quotes[8] = "You can avoid reality, but you cannot avoid the consequences of avoiding reality."; quotes[9] = "When one person suffers from a delusion it is called insanity; when many people suffer from a delusion it is called religion." function buttonClickHandler() { nextQuote++; // roll back to 0 if we reach the end if (nextQuote >= quotes.length) { nextQuote = 0; } } document.getElementById('buton').addEventListener("click", buttonClickHandler, false); }

The only issue I can see is that your code doesn't appear to be using the nextQuote index to retrieve an element from the quotes array.我能看到的唯一问题是您的代码似乎没有使用nextQuote索引从quotes数组中检索元素。 You also don't appear to invoke myLost() anywhere, but I assume that's just been omitted from the example in the question.您似乎也没有在任何地方调用myLost() ,但我认为这只是在问题的示例中被省略了。

Also note that you can simplify the array definition, and you can use the modulo operator to access the array without needing to reset the index to 0 .另请注意,您可以简化数组定义,并且可以使用模运算符来访问数组,而无需将索引重置为0 Try this:尝试这个:

 function myLost() { let nextQuote = 0; let quotes = [ "Don't be so humble - you are not that great.", "Moral indignation is jealousy with a halo.", "Glory is fleeting, but obscurity is forever.", "The fundamental cause of trouble in the world is that the stupid are cocksure while the intelligent are full of doubt.", "Victory goes to the player who makes the next-to-last mistake.", "His ignorance is encyclopedic", "If a man does his best, what else is there?", "Political correctness is tyranny with manners.", "You can avoid reality, but you cannot avoid the consequences of avoiding reality.", "When one person suffers from a delusion it is called insanity; when many people suffer from a delusion it is called religion." ]; function buttonClickHandler() { let quote = quotes[nextQuote % quotes.length]; console.log(quote); nextQuote++; } document.querySelector('#buton').addEventListener("click", buttonClickHandler, false); } myLost();
 <button type="button" id="buton">Get quote</button>

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

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