如何在不重定向到新页面的情况下在文本区域中显示文件的内容

Question

<?php

    $blacklist = array("one.jps", "two.txt", "four.html");
    $files = array_diff(glob("*.*"), $blacklist);

    foreach($files as $file)
        echo "<div class='post'><a href='" . $_SERVER['PHP_SELF'] . "?file=" . $file . "'><p>" . $file . "</p></a></div>";


    if(!empty($_GET["file"]) && !in_array($_GET["file"], $blacklist) && file_exists($_GET["file"])) 
        $thesource = htmlentities(file_get_contents($_GET["file"]));

?>

<textarea rows="40" cols="100" placeholder="Source code of file" class="source"><?php if(!empty($thesource))echo $thesource; ?></textarea>

上面我使用的代码回显了目录中的所有文件（黑名单中的文件除外）。当用户单击该文件时，源代码（该文件中包含的所有内容）将显示在文本区域中。

单击该文件将在文本区域中显示源代码，但是当您单击该文件时，您将被转到一个新页面，其中源代码显示在文本区域中。简而言之，该代码有效，但您将被发送到一个新页面。我该怎么做才能让一切都发生在您所在的当前页面上。

我想我需要使用 AJAX 但我该怎么做呢？

请注意，当我说文件时，我指的是目录中回显到页面上的文件。它们嵌套在

元素中。

Answer 1

使用ajax加载文件内容到textarea

注意

在这个例子中，我假设文本区域有一个 id = "source"。

url- 这里是 url 页面，其中包含显示文件内容的获取参数。例如，http://example.com/get_file.php?file=abc.txt

function loadDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("source").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

编辑

需要给按钮添加onclick事件才能调用上面的函数

这里，一个jsfiddle

如何在不重定向到新页面的情况下在文本区域中显示文件的内容

How to display the contents of a file in a textarea without being redirected to a new page

php

ajax

ajaxform