What is best method for stopping a JavaScript code in a Loop from running for X Secon

**WorldNews** · Jan 16, 2013 19:47

Hi,

I have a complex Web page which has many different DIVs and many differnet Javascript functions.
I want one one of these functions to Loop continually, updating the value of a certain DIV with data from the Server. But I want this Loop to Stop for X seconds before executing again. What is the best method of achieving this objective?

Just to be clear: this Stop code should not stop all Javascript code from running or freez the Web browser but should ONLY stop that given Loop for X seconds.

Than You

**PicnicTutorials** · Jan 16, 2013 20:26

Possibly look to jquery .delay()

**WorldNews** · Jan 16, 2013 22:37

We do not use JQuery. Pure JavaScript solution only please. Thanks.

Originally Posted by EricWatson

Possibly look to jquery .delay()

**felgall** · Jan 17, 2013 02:22

setInterval(myfunc, 5000); will run the myfunc() function once every five seconds.

if you only want the function to run once then substitute setTimeout with the same parameters instead.

**WorldNews** · Jan 17, 2013 10:08

Hello,

Do we need to call the function myfunc from setTimeout or can we just call setTimeout to stop Javascript
from running for X Seconds and then call function myfunc with parameters we want.

And what is best way to start this infinite loop, via OnLOad of the BODY?
So like this would work?

<BODY Onload('stay_alive()'

>

function 'stay_alive()
{

$row_val = 0;
for (1 > 0) {

setTimeout(10000);
++$row_val;

display_value($row_val);

}

}

Originally Posted by felgall

setInterval(myfunc, 5000); will run the myfunc() function once every five seconds.
if you only want the function to run once then substitute setTimeout with the same parameters instead.

**Pullo** · Jan 17, 2013 11:39

Originally Posted by WorldNews

We do not use JQuery. Pure JavaScript solution only please. Thanks.

Would you mind sharing your reasons for not using jQuery.
Is it a compatibility issue?
I'm not trolling, I find this genuinely interesting.

**felgall** · Jan 17, 2013 12:27

JavaScript goes at the bottom of the page just before the </body> tag - onload is almost never needed any more when you attach the JavaScript there and attaching it at the bottom allows the page to load faster and the script to run as early as possible.

setTimeout takes two parameters - the first is the function mto run and the second is the delay before running that function.

setTimeout(stay_alive, 10000);

if you need to pass parameters to the function to be called then wrap it in an anonymous function

setTimeout(function() {stay_alive(x,y)}, 10000);

As for jQuery - that is a huge amount of code to do what can otherwise be done in just a couple of lines of JavaScript - unless you need to use a lot of the JQuery functionality in your page then it is far cleaner and faster to omit it.

**Pullo** · Jan 17, 2013 12:56

Originally Posted by felgall

As for jQuery - that is a huge amount of code to do what can otherwise be done in just a couple of lines of JavaScript - unless you need to use a lot of the JQuery functionality in your page then it is far cleaner and faster to omit it.

I agree that it's pointless to include jQuery for things that would be trivial to implement in pure JavScript.
However the current jQuery weighs in at 91 kb in its minified form and you easily can save this amount of bytes by optimizing your site in other ways (images etc).
The reason I asked is that I'm trying to weigh up the best use case for jQuery in my own mind (it is very tempting to use it for everything) and am interested in hearing other peoples opinions.
Anyway, this is getting a little off-topic. Thanks for taking the time to address the point though.

**felgall** · Jan 17, 2013 15:39

Originally Posted by Pullo

I agree that it's pointless to include jQuery for things that would be trivial to implement in pure JavScript.
However the current jQuery weighs in at 91 kb in its minified form and you easily can save this amount of bytes by optimizing your site in other ways (images etc).

not if all your pages average around 50k including all the images and scripts as is the case for most of my sites - also I already have my own versions of all of the various functions that JQuery provides that I actually use in my web pages toat only take up about 1k - it would be different if I were using more of the sorts of functionality that JQuery provides.

Originally Posted by Pullo

The reason I asked is that I'm trying to weigh up the best use case for jQuery in my own mind (it is very tempting to use it for everything) and am interested in hearing other peoples opinions.
Anyway, this is getting a little off-topic. Thanks for taking the time to address the point though.

If you are going to use JQuery then a couple of things to keep in mind:

1. it is best to use a common copy of the JQuery library such as the one provided by Google - that way a significant fraction of your visitors will already have it cached from other sites that also reference that copy and so they will not have to download it again - that saves 91k off what they have to download to use your page compared to if you use your own copy of the script.
2. A reasonable level of JavaScript knowledge is required in order to properly use JQuery which you have but which many of those posting questions in the forum obviously don't have based on some of the code I have seen (for example where someone uses 20 lines of code calling JQuery that could be done in fewer lines of JavaScript without JQuery.

From what I have seen, most JQuery questions in the forum are being asked by someone who is trying to use JQuery without knowing enough JavaScript first.

With the question being asked in this particular thread only one line of ordinary JavaScript is needed to do what was asked and so unless there is a need for JQuery elsewhere in the code there is no point including it.

**WorldNews** · Jan 18, 2013 00:12

Hi,

Thanks for this info.

But I am confused, well may be better say perplexed, by you saying that the function
setTimeout(update_user(), 10000);

should be called not from the <BODY Onload.....> but this JavaScript code should be placed inside the body of the page right
before the </body> tag!

So you saying like this:

<JavaScript>

update_user();

function update_user ()
{
for (1 > 0) {

setTimeout(update_new(), 10000);

}
}

function update_new ()
{
/* Update the relevant DIV in user browser */
}

</JavaScript>
</BODY>
<?HTML>

ThanX,

Originally Posted by felgall

JavaScript goes at the bottom of the page just before the </body> tag - onload is almost never needed any more when you attach the JavaScript there and attaching it at the bottom allows the page to load faster and the script to run as early as possible.
setTimeout takes two parameters - the first is the function mto run and the second is the delay before running that function.

setTimeout(stay_alive, 10000);

if you need to pass parameters to the function to be called then wrap it in an anonymous function

setTimeout(function() {stay_alive(x,y)}, 10000);

As for jQuery - that is a huge amount of code to do what can otherwise be done in just a couple of lines of JavaScript - unless you need to use a lot of the JQuery functionality in your page then it is far cleaner and faster to omit it.

**WorldNews** · Jan 18, 2013 00:16

Hi,

Reason we do not want JQuery are;

1- What felgall has already explained
2- I find JQuery really ugly language
3- I think it is a waste of time to learn a language that is overlay to another language. I mean why master JQuery when mastering JavaScript is more fundamental.

Now I do not want to start a flame War about JQuery. That is 1 I am sure there are cases where JQuery is definetly a good idea, 2 for some people it makes sense to use JQuery.

**Pullo** · Jan 18, 2013 01:10

Thank you for sharing your thoughts on jQuery, felgall and WorldNews.
As I said, I'm better trying to formulate my opinion on when and when not to use it, and this helps.
I especially agree with felgall's point two. As they say, when the only tool you have is a hammer, everything starts to look like a nail

So, to bring this back on topic:

Originally Posted by WorldNews

But I am confused, well may be better say perplexed, by you saying that the function
setTimeout(update_user(), 10000);

should be called not from the <BODY Onload.....> but this JavaScript code should be placed inside the body of the page right
before the </body> tag!

As a rule of thumb, inline JavaScript, just like inline CSS is to be avoided where possible.
If you're curious why, just ask Google: http://www.google.com/search?q=why+a...ine+javascript

So, instead of writing:

HTML Code:

<body onload="alert("hello")>

it's better to write:

HTML Code:

    <script>
      window.load=function(){
        alert("hello");
      }
    </script>
  </body>
</html>

However, as felgall points out, it's normally sufficient to write:

HTML Code:

    <script>
      alert("hello");
    </script>
  </body>
</html>

**felgall** · Jan 18, 2013 01:50

Originally Posted by WorldNews

setTimeout(update_user(), 10000);

That will run update_user() straight away and expect it to return a function - the function returned will be delayed for 10 seconds by the setTimeout.

to delay update_user for 10 seconds use:

setTimeout(update_user, 10000);

**felgall** · Jan 18, 2013 01:56

Originally Posted by WorldNews

2- I find JQuery really ugly language
3- I think it is a waste of time to learn a language that is overlay to another language. I mean why master JQuery when mastering JavaScript is more fundamental.

Neither of those makes sense since JQuery simnply IS JavaScript where you let someone else write a part of the JavaScript for you. Any JQuery statement is a JavaScript method call where the method called is defined using JavaScript within the JQuery oblect's JavaScript code.

JQuery is just one JavaScript object that someone has defined for you using JavaScript. JQuery isn't another layer on top of JavaScript it simply is JavaScript - which is why it makes no sense for people to try to use JQuery without understanding enough JavaScript to understand how JavaScript objects work.

Learning JavaScript is more fundamental than learning JQuery() or update_user() as you need JavaScript to define each of those objects before you can use them in your code.

**luc.tw** · Jan 22, 2013 16:35

Maybe you should try this:

Code:

<script>
(function update_user() {
    // retrieve data from server
    
    setTimeout(update_user, 10000);
}());
</script>

User Tag List

Thread: What is best method for stopping a JavaScript code in a Loop from running for X Secon

Thread Tools

Display

What is best method for stopping a JavaScript code in a Loop from running for X Secon

Bookmarks

Bookmarks

Posting Permissions