簡體   English   中英

使用JavaScript在iframe中顯示隨機php頁面

[英]show random php page in iframe using javascript

我想在iframe中加載.php。 我在帶有index.html的文件夾(具有iframe)中有10個以上的php文件。 在此i框架中,當用戶單擊“下一步...”時,我想隨機加載.php文件(無需重復-如果顯示的所有10個文件都顯示消息“ No More”),該如何編寫此javascript。

我的index.html看起來像這樣。 該文件和所有.php文件都放在同一文件夾中。

 <!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更改iframe src,然后從數組中排除頁面。

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)
}

實現這一目標的一種方法是將所有可能的頁面以任何順序排列在一個數組中。

然后,一旦函數觸發選擇隨機頁面,它應該執行以下操作:

a-檢查pages數組是否仍有頁面可供選擇

b-在0和數組中元素數之間選擇一個隨機索引

c-從該數組中切出元素並使用值加載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"> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM