javascript - 未选中时的复选框

Question

我试图让一个复选框在选中时执行计时事件，并在未选中时停止。它在选中时有效，但是当我取消选中它时，它只是再次执行该函数，变量变得更快。

Live

JS代码

var money = 0;

function moneyMaker(){
    money++;
  document.getElementById('money').innerHTML = money;
}

function doautoMoney(){
    window.setInterval(function(){

        moneyMaker();
        document.form.automoney.click();
        //alert('Auto Saved!');
    }, 1000); 
}

Answer 1

使用 clearInterval() 清除未选中的间隔 并且在复选框的情况下使用 onchange 而不是 onclick。

var money = 0;

function moneyMaker() {
  money++;
  document.getElementById('money').innerHTML = money;
}
var int;

function doautoMoney(chk) {
  if (chk)
    // store the interval reference for clearing the interval
    int = window.setInterval(function() {
      moneyMaker();
      //document.form.automoney.click();
      //alert('Auto Saved!');
    }, 1000);
  else
    clearInterval(int)
}

Money: <span id="money">0</span>
<p>
  <button onclick="moneyMaker(1)">Mine Iron!</button>
  <input type="checkbox" name="automoney" onchange="doautoMoney(this.checked);">