Russell Parrott Russell Parrott - 2 months ago 8
jQuery Question

JQuery auto refresh (setInterval)

Hi folks not sure the best way to do this - i.e. where to put the

's .. I have a div that loads a page and has a setInterval() function.

On the loaded page there is 1 button, What I want to acheive is when button #1 (loaded page) is clicked to stop the setInterval() and append a new div (position absolute) until button#2 (on the apended div) is clicked then to restart it. .. comprende?

Here is my "base" code

This is the action from the first button

$('.discussion').append('<div class="replyarea">some content in here plus "button number2</div>');

This loads the page - initially


And this is the refresh function

var auto_refresh = setInterval(

}, 10000);

Failing anything - (but NOT preferred) I could use a toggle on the loaded page rather than the append used in the
, but would still need to stop the refresh and restart it - based on the toggle, but I stress the toggle idea is not the preferred way.


I created an example for you at JSFiddle. Check it out here:


var intervalId = 0;
intervalId = setInterval(fadeDiscussion, 3000);

$(function() {
    $('input[name=click]').bind('click', function() {

        $('.discussion').append('<div class="replyarea">some content in here plus <input type="button" name="save" value="save"></div>');    

    $('input[name=save]').live('click', function() {
         intervalId = setInterval(fadeDiscussion, 3000);   

var i = 1;
function fadeDiscussion () {