Fatal编程技术网
  • javascript/
  • Javascript AJAX和PHP根据需要使用递归迭代器获取文件和文件夹列表

Javascript AJAX和PHP根据需要使用递归迭代器获取文件和文件夹列表

javascript php ajax

Javascript AJAX和PHP根据需要使用递归迭代器获取文件和文件夹列表,javascript,php,ajax,Javascript,Php,Ajax,我需要从服务器获取文件和文件夹列表。 我不想一次获取所有文件、文件夹和子文件夹。 我想根据需要一点一点地得到他们的。所以我使用AJAX 我使用PHP。我使用递归迭代器 我在没有AJAX的情况下做到了这一点，但我无法使用AJAX做到这一点： 它仅适用于第一个目录（~根目录）。我无法在函数中传递$name变量 **不是JQuery** PHP <?php if (isset($_GET['you_choose_directory'])){print "do something";} get


我需要从服务器获取文件和文件夹列表。
我不想一次获取所有文件、文件夹和子文件夹。
我想根据需要一点一点地得到他们的。所以我使用AJAX


我使用PHP。我使用递归迭代器

我在没有AJAX的情况下做到了这一点，但我无法使用AJAX做到这一点：

它仅适用于第一个目录（~根目录）。我无法在函数中传递$name变量

**不是JQuery**

PHP

<?php 
if (isset($_GET['you_choose_directory'])){print "do something";}

getList("/start_folder/"); //always(

function getList($name) {
    $path = realpath($name);
    $objects = new RecursiveIteratorIterator(new RecursiveDirectoryIterator($path, FilesystemIterator::SKIP_DOTS), RecursiveIteratorIterator::CATCH_GET_CHILD);
    foreach($objects as $name => $object){
        if (filetype($name) == "dir") {
            print "<a href='?you_choose_directory=" . basename($name) . "'><b>" . basename($name) . "</b></a>";
        } else {
            print "<a><div></div><b>" . basename($name) . "</b></a>";
        }
    }
}
?>
HTML

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8"/>
    <title>file list</title>
    <script src="javascript.js"></script>
</head>
<body onload="doOnLoad();">
    <div id="it_is_files">

    </div>
</body>
</html>


文件列表
谢谢

（我不懂PHP。）

它只对根目录有效的原因是：

print "<a href='?you_choose_directory=" . basename($name) . "'><b>" . basename($name) . "</b></a>";

print”“；
您正在创建一个指向您所在html页面的链接，因此页面将重新加载，所有内容都将重新开始。您需要将a标记的href设置为javascript:void，这样页面就不会重新加载。然后需要添加onClick事件处理程序来调用do_it（）函数，并将路径传递给要列出其内容的目录。您需要更改do_it（），以便它可以接受一个参数

HTML和javascript：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8"/>
    <title>file list</title>
    <script type="text/javascript">

    function getXmlHttp(){
      var xmlhttp;
      try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
          xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E) {
          xmlhttp = false;
        }
      }
      if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        xmlhttp = new XMLHttpRequest();
      }
      return xmlhttp;
    }

    function do_it(dirName) {
        var req = getXmlHttp();
        var list = document.getElementById('it_is_files');  
        req.onreadystatechange = function() {
            if (req.readyState == 4) {
                if(req.status == 200) {
                    list.innerHTML = req.responseText;
                }
            }
        }
        req.open('GET', 'getList.php?you_choose_directory=' + dirName, true);
        req.send(null);
        list.innerHTML = 'loading...';
    }

    </script>
</head>
<body onload="do_it('');">
    <div id="it_is_files">

    </div>
</body>
</html>


文件列表
函数getXmlHttp（）{
var-xmlhttp；
试一试{
xmlhttp=新的ActiveXObject（“Msxml2.xmlhttp”）；
}捕获（e）{
试一试{
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}捕获（E）{
xmlhttp=false；
}
}
如果（！xmlhttp&&typeof XMLHttpRequest！=“未定义”）{
xmlhttp=新的XMLHttpRequest（）；
}
返回xmlhttp；
}
函数do_it（dirName）{
var req=getXmlHttp（）；
var list=document.getElementById（'it_is_files'）；
req.onreadystatechange=函数（）{
如果（req.readyState==4）{
如果（请求状态==200）{
list.innerHTML=req.responseText；
}
}
}
请求打开（'GET'，'getList.php？您选择目录='+dirName，true）；
请求发送（空）；
list.innerHTML='正在加载…'；
}
PHP:
差不多了。不要忘记addslashes:$path=addslashes（realpath（$name））；当一个XMLHttpRequest对象似乎足够时，为什么要使用这么多的
try
s来获取ActiveXObject？另外，我认为.php文件名为getList.php是正确的吗？ 
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8"/>
    <title>file list</title>
    <script type="text/javascript">

    function getXmlHttp(){
      var xmlhttp;
      try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
          xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E) {
          xmlhttp = false;
        }
      }
      if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        xmlhttp = new XMLHttpRequest();
      }
      return xmlhttp;
    }

    function do_it(dirName) {
        var req = getXmlHttp();
        var list = document.getElementById('it_is_files');  
        req.onreadystatechange = function() {
            if (req.readyState == 4) {
                if(req.status == 200) {
                    list.innerHTML = req.responseText;
                }
            }
        }
        req.open('GET', 'getList.php?you_choose_directory=' + dirName, true);
        req.send(null);
        list.innerHTML = 'loading...';
    }

    </script>
</head>
<body onload="do_it('');">
    <div id="it_is_files">

    </div>
</body>
</html>

<?php 

$dir = "./"; //default to root directory
if (strlen($_GET['you_choose_directory']) > 0){$dir = $_GET['you_choose_directory'];}
getList($dir);

function getList($name) {
    $path = realpath($name);
    $objects = new RecursiveIteratorIterator(new RecursiveDirectoryIterator($path, FilesystemIterator::SKIP_DOTS), RecursiveIteratorIterator::CATCH_GET_CHILD);
    foreach($objects as $name => $object){
        if (filetype($name) == "dir") {
            print "<br/><a href='javascript:void' onClick='do_it(\"" . $path . "/" . basename($name) . "\")'><b>" . basename($name) . "</b></a>";
        } else {
            print "<br/><a><b>" . basename($name) . "</b></a>";
        }
    }
}

?>