How to swap between two different pages in my DIV?

Question

tl,dr:How can I rotate between two different pages in my DIV?

Hi, I am currently using the following code (Thank your internets!) to refresh PageThatGetsRefreshed.asp in a DIV on my page. All of this works famously.

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js">
    </script>
    <script>
            $.ajaxSetup ({ cache: false });
            var auto_refresh = setInterval(
            function()
            {
            $('#container').load('PagethatGetsRefreshed.asp')}, 10000);
</script>
</head>
<body>
    <div id="container">
        <font size="4" face="arial" color="grey"> <i>Page </i></font>
    </div>
</body>

What I would like to do now is to rotate between two different pages in that DIV. IE,. page1.asp shows for 10 seconds and then changes to page2.asp for 10 seconds then back to page1.asp.

Pretty new to jquery here so I can't for the life of me figure out how I should accomplish this. I believe I should be writing to a global variable somewhere to indicate which page is currently loaded then use IF/Else to load the other page and change the variable but I cant get this to work, Grrrr.

Also, can someone tell me does the script here continue to run so that the var auto_refresh always remains active or is it lost and reinitiated each time the scripts runs?

Thanks Everybody KG

mgraph · Accepted Answer · 2012-04-03T13:33:40.843

1

var frs = true;
$.ajaxSetup ({ cache: false });

var auto_refresh = setInterval(function(){
    var pg = (frs)?"page1.asp":"page2.asp"; // if(frs==true){pg = page1.asp}else{...
    frs = !frs ; // negation of frs
    $('#container').load(pg)}, 10000);

edited Apr 03 '12 at 13:33

answered Apr 03 '12 at 12:34

mgraph

15,238
4
41
75

This works perfectly. had to change $var to var. How would I extend to a third page? Thanks you so much! – kgjunk Apr 03 '12 at 13:31
I got the following to work. may not be elegant but it works ` var frs = 1; $.ajaxSetup ({ cache: false }); var auto_refresh = setInterval( function() { if (frs==1) { var pg = "Page_1.asp"; frs = 2; } else if(frs==2) { var pg = "Page_2.asp"; frs = 3; } else if(frs==3) { var pg = "Page_3.asp"; frs = 1; } else { var pg = "Page_1.asp"; frs = 3; } ('#container').load(pg)}, 2000); ` – kgjunk Apr 03 '12 at 16:14

score 0 · Answer 2 · edited May 23 '17 at 10:08

0

You can use javascript settimeout or you can use jquery everyTime

//pseudo code
setInterval(function() {
    if (page1) {
        page2.show();
    }
}, 10000)

Refer this question for more info jquery "everyTime" function

edited May 23 '17 at 10:08

Community

1
1

answered Apr 03 '12 at 12:34

Sandeep Manne

6,030
5
39
55

How to swap between two different pages in my DIV?

2 Answers2