Pass a variable integer into jquery function?

Question

Be so kind as to take a look at this jsfiddle: http://jsfiddle.net/ne6sg/2/

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script>
$(document).ready(function() {
setInterval(function(){
var interval = 500;
var paras = $('font');
var rand = Math.floor(Math.random() * paras.length);    
paras.eq(rand).addClass('red');
 },500);   
});
</script>
 <style>
.red {
    color: red;
}
 </style>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>  
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>

Everything is working perfectly. When run, my script gives the class .red to page elements at random, using the setInterval function to give the class at a set rate. This rate is defined by the number on line7 of the script. When this number is made larger, the speed at which the class is added is slowed down, because of the larger interval.

However, I want that number on line7 to be an integer variable, and yet I can't get it to work.

IN CONCLUSION, why doesn't this work: http://jsfiddle.net/ne6sg/3/ ?

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script>
$(document).ready(function() {
setInterval(function(){
var interval = 500;
var paras = $('font');
var rand = Math.floor(Math.random() * paras.length);    
paras.eq(rand).addClass('red');
 },(interval));   
});
</script>
 <style>
.red {
    color: red;
}
 </style>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>  
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>
<font color=#040404>Frabjous Day</font>

Thanks so much for your time.

YOur two fiddles are identical btw

user400654
– user400654

2013-02-13 20:02:06 +00:00
Commented Feb 13, 2013 at 20:02 — user400654
– user400654, Commented Feb 13, 2013 at 20:02

BrunoLM · Accepted Answer · 2013-02-13 20:01:29Z

2

Define interval out of the scope of the setInterval

var interval = 500; // this line, declare it here

setInterval(function(){

    var paras = $('font');
    var rand = Math.floor(Math.random() * paras.length);    
    paras.eq(rand).addClass('red');

}, interval); // so it exists in this context

answered Feb 13, 2013 at 20:01

BrunoLM

101k86 gold badges311 silver badges464 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amar · Accepted Answer · 2013-02-13 20:05:24Z

0

You are defining the interval variable inside the function and trying to use it just outside. Your js part would look something like the following:

$(document).ready(function() {
    var interval = 500;
setInterval(function(){
    var paras = $('font');
    var rand = Math.floor(Math.random() * paras.length);    
    paras.eq(rand).addClass('red');
     },1);   
});

See this: http://jsfiddle.net/ne6sg/6/

answered Feb 13, 2013 at 20:05

Amar

12k5 gold badges52 silver badges73 bronze badges

Collectives™ on Stack Overflow

Pass a variable integer into jquery function?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related