简介/我想实现什么
句子生成器功能齐全，每当您刷新页面或第一次单击按钮时，都会从数组中的单词生成随机句子。虽然第二次单击该按钮似乎不起作用，但它实际上所做的是生成完全相同的句子并替换前一个句子。如果将 onclick 函数内的 = true 更改为 += true，就会更清楚地看到这一点，它将输出完全相同的句子而不覆盖前一个。我希望每次单击按钮时它都会输出一个新的随机句子来代替之前的句子。
<!DOCTYPE html>
<html>
<head>
<title>Randomiser Example</title>
</head>
<body>
<section>
<div id="random"></div>
<button id="reload">get a new sentence!</button>
<p><span id="serving"></span> Permuations</p>
</section>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
/* word bank */
var article, word1, word2, word3, conjunction, word4;
article = ['The', 'Your', 'This'],
word1 = ['apple', 'orange', 'grape'],
word2 = ['pineapple','mango','banana'],
word3 = ['melon', 'avocado', 'raspberry'],
conjunction = ['and', 'because', 'but', 'as', 'since'],
word4 = ['blueberry', 'gooseberry', 'tangerine'];
/* randomiser */
for (var i = 0; i <= 0; i++) {
var article_rnd, word1_rnd, word2_rnd, word4_rnd, word3_rnd, conjunction_rnd, space;
article_rnd = Math.floor(Math.random() * article.length);
word1_rnd = Math.floor(Math.random() * word1.length);
word2_rnd = Math.floor(Math.random() * word2.length);
word4_rnd = Math.floor(Math.random() * word4.length);
word3_rnd = Math.floor(Math.random() * word3.length);
conjunction_rnd = Math.floor(Math.random() * conjunction.length);
space = ' ';
/* permutations */
var csv = (function() {
return function(n) {
return Intl.NumberFormat().format(n);
};
})
();
var really = article.length * word1.length * word2.length * word3.length * conjunction.length * word4.length;
var serving = csv(really);
/* random sentence */
var truth = '"' + article[article_rnd] + space + word1[word1_rnd] + space + word2[word2_rnd] + space + word3[word3_rnd] + space +
conjunction[conjunction_rnd] + space + word4[word4_rnd] + '"';
document.getElementById('random').innerHTML = truth;
document.getElementById('serving').innerHTML = serving; /* permutations */
document.getElementById('reload').onclick = function() {
document.getElementById('random').innerHTML = truth;
};
};
</script>
</body>
</html>
我尝试过的
我对 JavaScript 的了解有些有限(阅读:非常)，因此我尝试的解决方案也是如此。我最初的解决方案是简单地取消按钮，并使用 iFrame 将脚本加载到页面中，然后我将有一个按钮，可以简单地重新加载框架并以这种方式生成句子。当然，这可行，但并不理想。我的另一个解决方案是在生成新句子之前删除前一句，但这不起作用。我认为加载页面时生成的句子可能与按下按钮时生成的句子冲突，但删除该行代码也没有效果。
我进行了广泛的搜索(包括这里)，我所能找到的似乎在我的球场上很遥远的问题都是 3 年前的问题，其中生成器更简单，提问者想要的地方结果略有不同。我认为有一种方法可以根据前一个句子检查新生成的句子并强制它输出一个新句子。我还假设有一种更简单的方法，我已经错过了 15 次，这会让我觉得很傻。
最佳答案
将其包装在函数内，然后 onclick 调用该函数
<!DOCTYPE html>
<html>
<head>
<title>Randomiser Example</title>
</head>
<body>
<section>
<div id="random"></div>
<button id="reload">get a new sentence!</button>
<p><span id="serving"></span> Permuations</p>
</section>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
function truth_generate(){
/* word bank */
var article, word1, word2, word3, conjunction, word4;
article = ['The', 'Your', 'This'],
word1 = ['apple', 'orange', 'grape'],
word2 = ['pineapple', 'mango', 'banana'],
word3 = ['melon', 'avocado', 'raspberry'],
conjunction = ['and', 'because', 'but', 'as', 'since'],
word4 = ['blueberry', 'gooseberry', 'tangerine'];
/* randomiser */
for (var i = 0; i <= 0; i++) {
var article_rnd, word1_rnd, word2_rnd, word4_rnd, word3_rnd, conjunction_rnd, space;
article_rnd = Math.floor(Math.random() * article.length);
word1_rnd = Math.floor(Math.random() * word1.length);
word2_rnd = Math.floor(Math.random() * word2.length);
word4_rnd = Math.floor(Math.random() * word4.length);
word3_rnd = Math.floor(Math.random() * word3.length);
conjunction_rnd = Math.floor(Math.random() * conjunction.length);
space = ' ';
/* permutations */
var csv = (function() {
return function(n) {
return Intl.NumberFormat().format(n);
};
})
();
var really = article.length * word1.length * word2.length * word3.length * conjunction.length * word4.length;
var serving = csv(really);
/* random sentence */
var truth = '"' + article[article_rnd] + space + word1[word1_rnd] + space + word2[word2_rnd] + space + word3[word3_rnd] + space +
conjunction[conjunction_rnd] + space + word4[word4_rnd] + '"';
document.getElementById('random').innerHTML = truth;
document.getElementById('serving').innerHTML = serving; /* permutations */
};
return truth;
}
document.getElementById('reload').onclick = function() {
document.getElementById('random').innerHTML = truth_generate();
};
document.getElementById('random').innerHTML = truth_generate();
</script>
</body>
</html>关于javascript - 我有一个随机化器，可以在单击按钮(工作)时从数组中输出一个句子，但第二次单击会输出完全相同的句子，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60420601/