jquery auto refresh without blinking

Question

<script type="text/javascript">
window.onload = setupRefresh;

function setupRefresh() {
  setTimeout("refreshPage();", 1000);
}
function refreshPage() {
   window.location = location.href;
}

The page is now reloading every second the only problem its blinking how to fix this

Answer 1

You could use a div and a .get with jquery to get your data from another page on your website.

You can use setTimeOut(function, time)

$(function() {
    startRefresh();
});

function startRefresh() {
    setTimeout(startRefresh,1000);
    $.get('pagelink.php', function(data) {
        $('#content_div_id').html(data);    
    });
}

Answer 2

If the page is completely reloading and overwriting itself (including the script that is doing the reloading, then try this version:

function startRefresh() {
    $.get('', function(data) {
        $(document.body).html(data);    
    });
}
$(function() {
    setTimeout(startRefresh,1000);
});

Answer 3

You can't reload a page that way without the blink effect. Have a look at AJAX to fetch updated content of the page and display it asynchronously in the "existing" page.

Have a look at: http://www.brightcherry.co.uk/scribbles/jquery-auto-refresh-div-every-x-seconds/, to refresh part of the screen (the part can be the unique <DIV> of the page).

Answer 4

Thanks for answer with function, but if I want use about 1 minute delay, I must start calling of function with the delay by this way:

<script type="text/javascript">
//<![CDATA[
var vTimeOut;

$(function() {
  vTimeOut= setTimeout(startRefresh, 60000)
});


function startRefresh() {
  clearInterval(vTimeOut);
  vTimeOut= setTimeout(startRefresh, 60000);
  $(<#div>).load(<loadURL>);
}

//]]>
</script>

Otherwise, the startRefresh functions fire very quickly or repeated more times.