show random php page in iframe using javascript

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

I would like to load .php in iframe. I have (more than) 10 php files in a folder with index.html,which has the iframe. In this i frame I would like load the .php files randomly (withou repeat-If all 10 files shown then show the messgae "No More") when user click Next... How do I write this javascript.

My index.html looks like this . This file and all the .php files placed in the same folder.

 <!DOCTYPE HTML>

<html>

   <head>

      <title>Test</title>

      <link rel="stylesheet" type="text/css" href="main.cs" />

   </head>

   <body class="is-demo">

   <header id="demo-header">

         <div class="details">

            <div class="inner">

               <h1>one.php title</h1>

            </div>

         </div>

         <ul class="actions">

            <li><a href="index.php" ><span>Home Page</span></a></li>

            <li><a href="ten.php" class="button square previous"><span>Previous</span></a></li>



            <li><a href="javascript:choose_random_page()" class="button square next"><span>Next</span></a></li>

         </ul>

      </header>





      <script>

      var iframe = document.getElementById("demo-iframe");

var pages = ["one.htm", "two.htm", "three.htm", 

             "four.htm", "five.htm", "six.htm", 

             "seven.htm", "eight.htm","nine.htm",

             "ten.htm"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));



      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;



   } else {

      alert("No more pages to load");

   }

}

      </script>



      <div id="demo-main">

         <iframe id="demo-iframe" src="" data-responsive="1">-</iframe>

      </div>



   </body>

</html>

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

add a comment |

My index.html looks like this . This file and all the .php files placed in the same folder.

 <!DOCTYPE HTML>

<html>

   <head>

      <title>Test</title>

      <link rel="stylesheet" type="text/css" href="main.cs" />

   </head>

   <body class="is-demo">

   <header id="demo-header">

         <div class="details">

            <div class="inner">

               <h1>one.php title</h1>

            </div>

         </div>

         <ul class="actions">

            <li><a href="index.php" ><span>Home Page</span></a></li>

            <li><a href="ten.php" class="button square previous"><span>Previous</span></a></li>



            <li><a href="javascript:choose_random_page()" class="button square next"><span>Next</span></a></li>

         </ul>

      </header>





      <script>

      var iframe = document.getElementById("demo-iframe");

var pages = ["one.htm", "two.htm", "three.htm", 

             "four.htm", "five.htm", "six.htm", 

             "seven.htm", "eight.htm","nine.htm",

             "ten.htm"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));



      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;



   } else {

      alert("No more pages to load");

   }

}

      </script>



      <div id="demo-main">

         <iframe id="demo-iframe" src="" data-responsive="1">-</iframe>

      </div>



   </body>

</html>

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

add a comment |

My index.html looks like this . This file and all the .php files placed in the same folder.

 <!DOCTYPE HTML>

<html>

   <head>

      <title>Test</title>

      <link rel="stylesheet" type="text/css" href="main.cs" />

   </head>

   <body class="is-demo">

   <header id="demo-header">

         <div class="details">

            <div class="inner">

               <h1>one.php title</h1>

            </div>

         </div>

         <ul class="actions">

            <li><a href="index.php" ><span>Home Page</span></a></li>

            <li><a href="ten.php" class="button square previous"><span>Previous</span></a></li>



            <li><a href="javascript:choose_random_page()" class="button square next"><span>Next</span></a></li>

         </ul>

      </header>





      <script>

      var iframe = document.getElementById("demo-iframe");

var pages = ["one.htm", "two.htm", "three.htm", 

             "four.htm", "five.htm", "six.htm", 

             "seven.htm", "eight.htm","nine.htm",

             "ten.htm"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));



      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;



   } else {

      alert("No more pages to load");

   }

}

      </script>



      <div id="demo-main">

         <iframe id="demo-iframe" src="" data-responsive="1">-</iframe>

      </div>



   </body>

</html>

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

My index.html looks like this . This file and all the .php files placed in the same folder.

 <!DOCTYPE HTML>

<html>

   <head>

      <title>Test</title>

      <link rel="stylesheet" type="text/css" href="main.cs" />

   </head>

   <body class="is-demo">

   <header id="demo-header">

         <div class="details">

            <div class="inner">

               <h1>one.php title</h1>

            </div>

         </div>

         <ul class="actions">

            <li><a href="index.php" ><span>Home Page</span></a></li>

            <li><a href="ten.php" class="button square previous"><span>Previous</span></a></li>



            <li><a href="javascript:choose_random_page()" class="button square next"><span>Next</span></a></li>

         </ul>

      </header>





      <script>

      var iframe = document.getElementById("demo-iframe");

var pages = ["one.htm", "two.htm", "three.htm", 

             "four.htm", "five.htm", "six.htm", 

             "seven.htm", "eight.htm","nine.htm",

             "ten.htm"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));



      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;



   } else {

      alert("No more pages to load");

   }

}

      </script>



      <div id="demo-main">

         <iframe id="demo-iframe" src="" data-responsive="1">-</iframe>

      </div>



   </body>

</html>

javascript php

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

edited Nov 22 '18 at 10:10

asked Nov 22 '18 at 7:37

KID IN EXCEL

asked Nov 22 '18 at 7:37

KID IN EXCEL

asked Nov 22 '18 at 7:37

KID IN EXCEL

add a comment |

2 Answers
2

active

oldest

votes

Put all your pages to array, mix it, change the iframe src with javascript, exclude page from array after that.

var locations = ['a.php', 'b.php', 'c.php'];



for(var i = 0; i < locations.length; i++){

    // I put code for changing locations inside setTimeout, but you can change it with your logic.



    setTimeout(function(){

        document.getElementById('demo-iframe').src = locations[i];

    }, i * 1000)

}

answered Nov 22 '18 at 7:53

Volodymyr

416513

add a comment |

-1

One way to acheive that is to have all possible pages in an array, in any order.

Then once the function triggered to choose the random page, it should do the following:

a- check if pages array still has pages to choose from

b- select a random index between 0 and the number of elements in the array

c- slice the element from that array out and load iframe source with the value

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425981%2fshow-random-php-page-in-iframe-using-javascript%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

2 Answers
2

active

oldest

votes

2 Answers
2

active

oldest

votes

Put all your pages to array, mix it, change the iframe src with javascript, exclude page from array after that.

var locations = ['a.php', 'b.php', 'c.php'];



for(var i = 0; i < locations.length; i++){

    // I put code for changing locations inside setTimeout, but you can change it with your logic.



    setTimeout(function(){

        document.getElementById('demo-iframe').src = locations[i];

    }, i * 1000)

}

answered Nov 22 '18 at 7:53

Volodymyr

416513

add a comment |

Put all your pages to array, mix it, change the iframe src with javascript, exclude page from array after that.

var locations = ['a.php', 'b.php', 'c.php'];



for(var i = 0; i < locations.length; i++){

    // I put code for changing locations inside setTimeout, but you can change it with your logic.



    setTimeout(function(){

        document.getElementById('demo-iframe').src = locations[i];

    }, i * 1000)

}

answered Nov 22 '18 at 7:53

Volodymyr

416513

add a comment |

Put all your pages to array, mix it, change the iframe src with javascript, exclude page from array after that.

var locations = ['a.php', 'b.php', 'c.php'];



for(var i = 0; i < locations.length; i++){

    // I put code for changing locations inside setTimeout, but you can change it with your logic.



    setTimeout(function(){

        document.getElementById('demo-iframe').src = locations[i];

    }, i * 1000)

}

answered Nov 22 '18 at 7:53

Volodymyr

416513

Put all your pages to array, mix it, change the iframe src with javascript, exclude page from array after that.

var locations = ['a.php', 'b.php', 'c.php'];



for(var i = 0; i < locations.length; i++){

    // I put code for changing locations inside setTimeout, but you can change it with your logic.



    setTimeout(function(){

        document.getElementById('demo-iframe').src = locations[i];

    }, i * 1000)

}

answered Nov 22 '18 at 7:53

Volodymyr

416513

answered Nov 22 '18 at 7:53

Volodymyr

416513

answered Nov 22 '18 at 7:53

Volodymyr

416513

answered Nov 22 '18 at 7:53

Volodymyr

416513

add a comment |

-1

One way to acheive that is to have all possible pages in an array, in any order.

Then once the function triggered to choose the random page, it should do the following:

a- check if pages array still has pages to choose from

b- select a random index between 0 and the number of elements in the array

c- slice the element from that array out and load iframe source with the value

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

add a comment |

-1

One way to acheive that is to have all possible pages in an array, in any order.

Then once the function triggered to choose the random page, it should do the following:

a- check if pages array still has pages to choose from

b- select a random index between 0 and the number of elements in the array

c- slice the element from that array out and load iframe source with the value

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

add a comment |

-1

One way to acheive that is to have all possible pages in an array, in any order.

Then once the function triggered to choose the random page, it should do the following:

a- check if pages array still has pages to choose from

b- select a random index between 0 and the number of elements in the array

c- slice the element from that array out and load iframe source with the value

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

One way to acheive that is to have all possible pages in an array, in any order.

Then once the function triggered to choose the random page, it should do the following:

a- check if pages array still has pages to choose from

b- select a random index between 0 and the number of elements in the array

c- slice the element from that array out and load iframe source with the value

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

var iframe = document.getElementById("demo-iframe");

var pages = ["one.php", "two.php", "three.php", 

             "four.php", "five.php", "six.php", 

             "seven.php", "eight.php","nine.php",

             "ten.php"];



function choose_random_page() {

   if(pages.length>0) {

      var r = Math.floor(Math.random(pages.length));

      

      var ranom_page = pages.slice(r,1);

      iframe.src = random_page;

      

   } else {

      alert("No more pages to load");

   }

}

<iframe id="demo-iframe">

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

answered Nov 22 '18 at 7:49

Ahmad

8,37243764

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

add a comment |

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

I think templated.co/projection this website using as what am I expect. How do code this..?

– KID IN EXCEL
Nov 23 '18 at 6:48

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Cfrgtkky