jquery - Loop through an Array of links and dynamically load the contents of each after a set interval -
using jquery loop through array of links , load contents of each link div after set interval. example, if have parent page "parent.html" , array of links - "test1.html, test2.html , test3.html" load test1.html div within parent.html , after set interval replace test1.html test2.html , test3.html repeating process indefinitely.
i appreciate if me out. have tried using .get() , settimeout() don't have expertise , experience put together. welcome.
thank you.
this want.
you can view working demo here. loads each link once, caches result. subsequent iterations pull cache.
$(function(){    var curidx = 0,        urls   = $.map($("#links a"),function(el){ return $(el).attr('href') }),        cache  = {};     function nextpage(){        var url  = urls[curidx],            data = cache[url];         curidx += 1; if(curidx == urls.length) curidx = 0;         if(!data){          $("#content").load(url, function(data){            cache[url] = data;            nexttimer();          })        } else {          $("#content").html(data);          nexttimer();        }    };     function nexttimer(){      window.settimeout(function(){ nextpage() }, 3000); // 3 seconds    }     nextpage(); });   html
<ul id="links">   <li><a href="test1.html">test 1</a></li>   <li><a href="test2.html">test 2</a></li>   <li><a href="test3.html">test 3</a></li> </ul> <div id="content">  </div>      
Comments
Post a Comment