javascript - 我无法使这几行简单的代码正常工作,并且不知道为什么

标签 javascript

我尝试了这个简单的练习,我确实让它工作了,但不正确。当您单击按钮时,它应该为您提供 0 到 1000 之间的随机数。当您再次单击该按钮时,它会创建另一个随机数,如果它比上一个大,则会显示它。如果不是,则什么也不做。当它执行此操作时,它会计算运行该函数的次数。 我制作的那个确实给了我随机数字,但有时,它显示的数字比上一个小,有时却没有。我不明白为什么。我怀疑这可能是因为我试图更改按钮功能的代码行。

<!DOCTYPE html>
<html>
<head>
<input id="btn" type="button" onclick="initiate(1)" value="Click me!"><br>
<script>
function geid(id) {
    return document.getElementById(id);
}
var count = 0;

function initiate(n) {
    var x = n;
    n = Math.floor(Math.random() * 1000);
    document.getElementById("btn").onclick = function () {
        initiate(n);
    }

    if (n > x) {
        geid("fid").innerHTML = n;
        count += 1;
        geid("fid2").innerHTML = count + " times";

    } else {
        count += 1;
        geid("fid2").innerHTML = count + " times";

    }
}
</script>

</head>

<body>
Number : <div id="fid">0</div>
Tried <div id="fid2">0</div>

</body>

</html>

最佳答案

问题是您总是在更改 onclick 函数,无论新选择的 n 值是否大于先前的值 (x)或不。

举个例子:假设语句 Math.floor(Math.random()*1000); 在多次运行时生成以下值序列:100, 500, 200, 300 .

第一次单击时,该函数被调用为 initiate(1),点 fid1 设置为保存 100,并且onclick 处理程序设置为调用 initiate(100)

第二次单击时,该函数被调用为 initiate(100),点 fid1 设置为保存 500,并且onclick 处理程序设置为调用 initiate(500)。到目前为止一切顺利。

第三次单击时,该函数被调用为 initiate(500),点 fid1 保持在 500 不变,并且onclick 处理程序设置为调用 initiate(200)。嗯...

第四次单击时,该函数被调用为 initiate(200),点 fid1 设置为保存 300,并且onclick 处理程序设置为调用 initiate(300)

所以问题是,如果您想更改处理程序以始终保存 fid1 中的当前值,那么您不应该更改处理程序,除非 n > x .

关于javascript - 我无法使这几行简单的代码正常工作,并且不知道为什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20574887/

相关文章:

javascript - 从另一个树构建递归树

javascript - 在 Chrome 通知中打开网址

javascript - 如何在 cef 框架中支持 window.external.xxx

javascript - Node.js/Grunt - 无法运行 Grunt 的 watch - 为什么?

javascript - 未定义此字符串到数组

javascript - JavaScript 输入和输出之间的一(按键)事件延迟

javascript - 使用 fetch API 查询端点以获取 json 响应并返回空响应错误

javascript - 输出包含 3 个单词的字符串中的前 2 个单词

javascript - 用javascript中的另一个覆盖(包装)现有的jQuery点击事件

javascript - 渲染透明外壳