how to stop a javascript function from running? i include my example here.

**smansakra** · 12-24-2008, 06:50 AM

hello...

i have a function that running on my own site, i can create a function , but i'm not able to stop it,
please my example below...

<html>
<head>
<title>percobaan
</title>
<script type="text/javascript">

function alertku(opt){
if(opt=="run"){
var t = document.getElementById('alertku').innerHTML+="run ,";

setTimeout("alertku('run')",1000);
}
else if(opt=="stop") {return false;}
}
</script>
</head>
<body>
<input type="button" value="RUN" onclick="alertku('run');"> <input type="button" value="STOP" onclick="alertku('stop');"><br>

<span id="alertku">hum </span>
</body>
</html>

please, when i click stop, the function is still running....
can anyone help?

**smansakra** · 12-24-2008, 07:35 AM

hi, i have done!

use clear timeout to stop this...!

function alertku(opt){
if(opt=="run"){
var t = document.getElementById('alertku').innerHTML+="run ,";
exe = setTimeout("alertku('run')",1000);
}
else if(opt=="stop") {
exe = clearTimeout(exe);

}
}

**jscheuer1** · 12-24-2008, 02:39 PM

A better way:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Alertku - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function alertku(){
 if(alertku.opt){
  document.getElementById('alertku_span').firstChild.nodeValue += ', run';
  setTimeout(alertku, 1000);
 }
};
</script>
</head>
<body>
<div>
<input type="button" value="RUN" onclick="alertku.opt = true; alertku();"> 
<input type="button" value="STOP" onclick="alertku.opt = false;"><br>
<span id="alertku_span">hum</span>
</div>
</body>
</html>

**Twey** · 12-29-2008, 12:20 AM

A better way:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Page Without Title</title>
    <script type="text/javascript">
      var Alertku = (function() {
        var tid;

        function start() {
          if (!tid)
            tid = setInterval((function(f) { f(); return f; })(tick), 1000);
        }

        function tick() {
          var el = document.getElementById('alertku_span');

          (el.firstChild || el.appendChild(document.createTextNode(""))).nodeValue += ', run';
        }

        function stop() {
          if (tid)
            clearInterval(tid);

          tid = null;
        }

        return { start: start,
                 stop:  stop };
      })();
    </script>
  </head>
  <body>
    <div>
      <input type="button" value="RUN" onclick="Alertku.start();"> 
      <input type="button" value="STOP" onclick="Alertku.stop();">
      <span id="alertku_span">hum</span>
    </div>
  </body>
</html>

John, beware that presentational <br>.

**jscheuer1** · 12-29-2008, 03:54 AM

Originally Posted by Twey

John, beware that presentational <br>.

Valid strict as used in my code, harms nothing that I can see, please elaborate. Unless you mean just in general. If that's what you are getting at, with such short lines (as in this case), I consider it acceptable.

Breaking long lines with a <br> is stupid though, because one never knows how they will otherwise layout in the viewport.

**Twey** · 12-29-2008, 07:47 AM

Valid, yes, but used presentationally. It's on the same order as tables for layout. Properly, it should be written using CSS display: block; or so.

Here's an abstraction of this behaviour:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Page Without Title</title>
    <script type="text/javascript">
      function Service(f, opts) {
        this.tid = null;
        this.f = f;
        this.interval = opts.interval || 1000;
        this.init = opts.init || Service.NONE_FUNCTION;
        this.final = opts.final || Service.NONE_FUNCTION;
        this.stopCond = opts.stopCond || Service.NONE_FUNCTION;
      }

      Service.prototype = {
        start: function() {
          if (!this.tid) {
            this.init();
            this.tick();
            this.tid = setInterval(function() { this.tick(); }, this.interval);
          }
        },

        tick: function() {
          if (this.stopCond())
            this.stop();
          else
            this.f();
        },

        stop: function() {
          if (this.tid && !this.final) {
            clearInterval(this.tid);
            this.tid = null;
          }
        }
      };

      Service.NONE_FUNCTION = function() { return false; };

      function alertku() {
        var el = document.getElementById('alertku_span');

        (el.firstChild || el.appendChild(document.createTextNode(""))).nodeValue += ', run';
      }

      var sAlertku = new Service(alertku);
    </script>
  </head>
  <body>
    <div>
      <input type="button" value="RUN" onclick="sAlertku.start();"> 
      <input type="button" value="STOP" onclick="sAlertku.stop();">
      <span id="alertku_span">hum</span>
    </div>
  </body>
</html>

Thread: how to stop a javascript function from running? i include my example here.

Thread Tools

Search Thread

how to stop a javascript function from running? i include my example here.

Bookmarks

Bookmarks

Posting Permissions