3

wow, this is my first post! New to programming and coding, this is something of my first projects I work on. I would like to be able to switch a toggle to run a code or to stop it, using the setInterval() for it. But now I am not able to switch it off when selecting the toggle. Tried multiple thing, like break; but not successful so far. Would be great if any of you could point me in the right direction.

Kind regards, Laurens

Code in HTML

<card>
<p>Theft Script ON/OFF</p>
<label class="switch">
<input id="executeTheftScript" type="checkbox" > Toggle me
</label>
</card>

Code in Javascript

function theftToggle(){
    var isChecked = document.getElementById("executeTheftScript").checked;
    if (isChecked) {
        var i = setInterval(function(){
            if (person1.credits === 0) {
                clearInterval(i);
                updateStats();
                console.log("You don't have any credits.");
            } else {
                theft();
                person1.credits--;
                updateStats();
            };
        }, 500);
    } else {
        console.log("Your script is stopped.");
    }
}

document.getElementById("executeTheftScript").addEventListener('click', theftToggle);

Running of the code;

enter image description here

Laurens
  • 33
  • 3
  • Hello, where is your theftToggle() function call in your code ? can you provide more informations about "toggling" your button ? it's important to know about changes before analysing the results issue – sohaieb azaiez Feb 28 '21 at 13:21
  • @sohaieb thank you for your reply. I've added some more content, is this sufficient information? – Laurens Feb 28 '21 at 16:17
  • Hello Laurens, you are welcome, I'm sorry for my late, and i see that your question is answered. I'm glad for that ^_^ – sohaieb azaiez Feb 28 '21 at 17:07

1 Answers1

0

you need addEventListener to the input and it better to set the setInterval variable outside function or make it global so it will not create duplicate setInterval.

var interval;
var person1 = {
  credits: 10
}
 
// listen the input for checked change
document.getElementById("executeTheftScript").addEventListener('change', theftToggle);

function theftToggle() {
  var isChecked = document.getElementById("executeTheftScript").checked;
  if (isChecked) {
    interval = setInterval(function() {
      if (person1.credits === 0) {
        clearInterval(interval);
        updateStats();
        console.log("You don't have any credits.");
      } else {
        theft();
        person1.credits--;
        updateStats();
      }
    }, 500);
  } else {
    clearInterval(interval)
    console.log("Your script is stopped.");
  }
}

function theft() {}

function updateStats() {
  console.log("credits: ", person1.credits);
}
<card>
  <p>Theft Script ON/OFF</p>
  <label class="switch">
    <input id="executeTheftScript" type="checkbox"> Toggle me
  </label>
</card>
uingtea
  • 6,002
  • 2
  • 26
  • 40
  • Hi Uingtea, thank you for your reply. I've tried your recommended changes, but unfortunately it did not succeeded. I am still not able to switch off the script, so the loop continues until there are no credits left. – Laurens Feb 28 '21 at 16:10
  • I see your question updated, but I still the setInterval variable or `var i = setInterval(...` inside function, it should be outside like my answer. – uingtea Feb 28 '21 at 16:16
  • it worked, i did not removed my document.getElementById("executeTheftScript").addEventListener('click', theftToggle);.. once removed, it worked! – Laurens Feb 28 '21 at 16:21