Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery auto refresh div

Jquery auto refresh is using up a LOT of browser memory. Is there a way to stop this. I had a 2 div refreshing every 3 seconds but I moved it up to 9 and 15 seconds, It helped a little bit the longer the window stays open on my site the more memory it takes until finally the browser crashes.

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


<script>
var auto_refresh = setInterval(
function ()
{
$('#details2').load('links2.php').fadeIn("slow");
}, 15000); // refresh every 10000 milliseconds</script>
like image 451
John Sims Avatar asked Jun 20 '10 18:06

John Sims


People also ask

How do I make a Div auto refresh?

Use window. setInterval() to Refresh a div in JavaScript.

How do I automatically refresh part of an HTML page?

Approach 1: One can auto refresh the webpage using the meta tag within the head element of your HTML using the http-equiv property. It is an inbuilt property with HTML 5. One can further add the time period of the refresh using the content attribute within the Meta tag.

What is jQuery load function?

The jQuery load() method is a simple, but powerful AJAX method. The load() method loads data from a server and puts the returned data into the selected element. Syntax: $(selector).load(URL,data,callback); The required URL parameter specifies the URL you wish to load.


1 Answers

You could try to skip the load() and use $.ajax instead. I know load(); is an ajax request but I seem to recall it fetches the whole script. Try requesting a script, do your database calculations and return the data as json. I assume you're sending complete html with the data from the database request. Try this with json instead.

You'll get the data as an object, like this for example.

{"variable":"foo"}

Then you can fetch the data with a simple each statement.

$.ajax({
    url: "links2.php",
    type: "POST",
    dataType: "json",
    success: function(data){

       // data here is returned as objects since it's json
       $.each(data, function(key, value) {
            $("#details2").empty().append(value.variable);
       }); 

    }
});

I think this shouldn't leak your memory and eventually crash your browser, even though you call it every other second or so. Give it a try and let me know how it goes.

Good luck!

like image 157
Stefan Konno Avatar answered Sep 18 '22 19:09

Stefan Konno