Question

我需要知道如何根据目录中有多少html文件自动创建Iframe。假设我在1.html所在的子目录中有2.html和main.html。我想自动创建2个iframe（在main.html中），一个显示1.html，另一个显示2.html。顺便说一句，如果你不知道，2.html和1.html是本地文件

Answer 1

尝试这样实现：

$.ajax({
    url: "/images-folder-on-server/",
    success: function (data) {
        var file_count = $(data).length();
        $.each( data, function( key, value ) {
           appendIframe(value);
        });
    }
});

function appendIframe( file)
{
   var iframe = document.createElement('iframe');
   iframe.src = file;
   iframe.style.width = "100px";
   iframe.style.height = "100px";
   document.body.appendChild(iframe);
}

Answer 2

对服务器进行ajax调用以获取目录中的文件列表

httpRequest = new XMLHttpRequest();

httpRequest.onreadystatechange = function(){
   //iterate the list and call addIframe( src ) for each of them 
};
httpRequest.open('GET', "listFilesInDirectory");
httpRequest.send();

这就是addIframe的样子

function addIframe( src )
{
   var iframe = document.createElement('iframe');
   iframe.src = src;
   iframe.style.width = "640px";
   iframe.style.height = "px";
   document.body.appendChild(iframe);
}

addIframe( "subdir/1.html" );
addIframe( "subdir/2.html" );

Answer 3

我认为问题不在于如何使用Javascript创建iFrame，而是使用它来计算文件。我建议创建ajax请求到服务器端语言来计算文件数，然后你可以使用该数字来使用jQuery创建iFrame元素。您可以使用以下PHP中编写的代码作为服务器端脚本： -

<?php
function getNoFiles(){
    $i = 0;
    $dir = 'yourHTMLDirectory/';
    if ($handle = opendir($dir)) {
        while (($file = readdir($handle)) !== false){
            if (!in_array($file, array('.', '..')) && !is_dir($dir.$file))
                $i++;
        }
    }
echo $i;
  }

?>

你可以在简单的循环中使用这样的jQuery简单代码来创建PHP代码中的计数限制。

$('<your iframe tag></iframe>').appendTo('your div or area class or id');

JavaScript自动化iframe创建

3 个答案: