Javascript SetInterval函数参数_Javascript_Twitter Bootstrap

Javascript SetInterval函数参数

javascript twitter-bootstrap

Javascript SetInterval函数参数,javascript,twitter-bootstrap,Javascript,Twitter Bootstrap,我是编程新手，我正在尝试创建一个简单的javascript游戏我的问题是: 为什么window.setInterval函数似乎能阻止一切？我正在学习并试图重写整个过程，同时使用不同的变量名。最初的工作原理和预期的一样好，但是当我添加javascript的最后3行代码时，整个事情就变得没有响应了。我已经看了这段代码30分钟了，似乎找不到问题所在 main.js var things = 0; var gen1 = 0; function thingClick(number) { t

我是编程新手，我正在尝试创建一个简单的javascript游戏

我的问题是:

为什么window.setInterval函数似乎能阻止一切？

我正在学习并试图重写整个过程，同时使用不同的变量名。最初的工作原理和预期的一样好，但是当我添加javascript的最后3行代码时，整个事情就变得没有响应了。我已经看了这段代码30分钟了，似乎找不到问题所在

main.js

var things = 0;
var gen1 = 0;


function thingClick(number) {
    things = things + number;
    document.getElementById("things").innerHTML = things;
}

function buyGen1() {
    var gen1Cost = Math.floor(10 * Math.pow(1.1, gen1));
    if(things >= gen1Cost) {
        gen1 = gen1 + 1;
        things = things - gen1Cost;
        document.getElementById('gen1').innerHTML = gen1;
        document.getElementById('things').innerHTML = things;
    }
    var nextCost = Math.floor(10 * Math.pow(1.1, gen1));
    document.getElementById('gen1Cost').innerHTML = nextCost;
}

window.setInterval(function) {
    thingClick(gen1);
}

index.html

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script type="text/javascript" src="js/main.js"></script>
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
        Things: <span id="things">0</span><br><br>
        <button onClick="thingClick(1)">Get Things</button><br><br>
        <button onClick="buyGen1()">Buy Generator Lvl. 1</button><br><br>
        Generators Lvl. 1: <span id="gen1">0</span> | Cost: <span id="gen1Cost">10</span>

     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>


引导101模板
事物：0


得到东西


购买发电机Lvl。1


发电机Lvl。1:0 |成本：10

语法当JavaScript发现一个错误时。它将完全停止，您的错误在语法中：

window.setInterval(function) {
    thingClick(gen1);
}

应该是：

window.setInterval(function () {
}, 500); // Adjust 500

流动编译器正在执行以下操作：

var interval = setInterval(function(){
  //call code here every n seconds
},delay)

var interval = setInterval(function(){
   thingClick(gen1);
},2000) //call it every 2000 milliseconds, or 2 seconds

使用参数

函数检查window.setInterval（）

编译器随后会注意到无效语法并抛出一个错误，阻止JavaScript运行


如果编译器出于某种原因没有停止，它会在{}
中看到一些随机代码，使它更加混乱



clearInterval（）
创建SetInterval时，应始终将其分配给变量，以便停止它。您不需要一个失控计时器：
var my_timer = window.setInterval(function () {
    thingClick(gen1);
}, 1000); // Every 1000 ms

然后您可以运行：
window.clearInterval(my_timer);

setInterval
的工作原理如下：
var interval = setInterval(function(){
  //call code here every n seconds
},delay)

var interval = setInterval(function(){
   thingClick(gen1);
},2000) //call it every 2000 milliseconds, or 2 seconds


一个实际的例子如下：
var interval = setInterval(function(){
  //call code here every n seconds
},delay)

var interval = setInterval(function(){
   thingClick(gen1);
},2000) //call it every 2000 milliseconds, or 2 seconds

所以你基本上把setInterval
写错了
你也可以通过清除它来停止你的间歇。因此，对于上面的示例，simlpy调用clearInterval（interval）
将停止/清除它。
因为您键入了<代码>设置间隔（函数（）{thingClick（gen1）；}，1000）或任何您想要的间隔。步骤1，查找什么是setInterval（）
，以及如何使用它。查看该教程的另一个注意事项。您希望尽量避免直接在HTML中添加JS，如onClick=“thingClick（1）”
，而不是在JavaScript代码中添加JS。您正在学习的教程中有一个正确使用setInterval（）
的示例。将其与您的代码进行比较。此外，您的首要任务之一应该是学习如何在浏览器中使用开发人员工具。每个浏览器都有它们，它们将极大地帮助您。例如，这里有一个很好的解释，但是“Flow”下的描述并不完全是它的工作原理。JavaScript引擎在遇到语法错误之前不会运行代码。如果存在语法错误，则不会在同一编译单元中运行任何代码（例如，脚本标记或文件）。有一个编译过程首先运行并检查所有语法。只有当该过程完成且没有错误时，它才会开始执行编译后的代码。@MichaelGeary我添加了like以便简化它我完全支持保持简单，但是为什么要给出一个不正确的解释，而正确的解释实际上更简单：首先，JavaScript引擎检查脚本标记或文件中的所有语法。如果有任何语法错误，它会立即停止，否则它会开始执行代码。顺便说一句，我坚持这一点不是为了让人讨厌，而是因为在编程中，拥有一个正确的思维模式是非常重要的。相信几乎正确但不完全正确的事情迟早会给你带来麻烦，因此了解它的实际工作原理是很有帮助的。是的，谢谢你的提醒。我要用谷歌搜索一些开发工具来帮我调试代码。