Javascript 用ajax调用PHP函数读取文件

我从输入类型文件获取文件输入，并在onchange事件上调用javascript函数，如下所示：

<input type="file" onchange="readTheFile(this)">

readFile.php的内容是：

<?php
function readFiles($fileLoc){
$file = fopen($fileLoc, "r") or exit("Unable to open file!");
while(!feof($file)) {
echo fgets($file);
}
fclose($file);
}

if(isset($_GET['fileLoc'])){
echo readFiles($_GET['fileLoc']);
}
?>

---

看起来您的请求格式不正确。根据文档，它说数据选项直接附加到GET请求的url上。我不认为这是可能的，因为您使用的是正确的php脚本

试着换成

function readTheFile(file){
$.ajax( 
           {
               url: 'readFile.php',
               type: 'GET',
               data: { fileLoc: file },
               success: function(output) 
               {
                   document.getElementById("content").innerHTML = output ;

               }
            }
        ); 
}

---

另外，我看不到从$\u GET数组中提取$fileLoc变量的位置。它可能只是从代码中排除

首先将文件移动到目录中，然后您的rest函数将工作

下面是一个通过ajax上传文件的jquery插件：

---

此插件将

$\u FILES

的参数发送到php文件，然后首先将文件移动到目录，然后使用

fopen（）

读取和显示内容。

我建议使用文件API方法（仅限moderns浏览器）

看

例如：

<input type="file" id="files" />

<script>
  function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object

    for (var i = 0, f; f = files[i]; i++) {

      var reader = new FileReader();

      // Closure to capture the file information.
      reader.onload = (function(theFile) {
        return function(e) {
          alert(e.target.result);
        };
      })(f);

      reader.readAsDataURL(f);
    }
  }

  document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>

功能手柄文件选择（evt）{
var files=evt.target.files；//文件列表对象
for（var i=0，f；f=files[i]；i++）{
var reader=new FileReader（）；
//闭包以捕获文件信息。
reader.onload=（函数（文件）{
返回函数（e）{
警报（如目标、结果）；
};
})（f） )；
reader.readAsDataURL（f）；
}
}
document.getElementById（'files'）.addEventListener（'change'，handleFileSelect，false）；

---

读取从客户端浏览器中选择的文件。您实际上不需要上传文件。如果您只想显示内容，而不想进一步使用。您可以使用javascript读取文件并显示内容。请建议我在代码中进行编辑。。我只想以这种方式读取文件。我已经试过你的代码了。这对我不起作用。

function readTheFile(file){
$.ajax( 
           {
               url: 'readFile.php',
               type: 'GET',
               data: { fileLoc: file },
               success: function(output) 
               {
                   document.getElementById("content").innerHTML = output ;

               }
            }
        ); 
}

<input type="file" id="files" />

<script>
  function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object

    for (var i = 0, f; f = files[i]; i++) {

      var reader = new FileReader();

      // Closure to capture the file information.
      reader.onload = (function(theFile) {
        return function(e) {
          alert(e.target.result);
        };
      })(f);

      reader.readAsDataURL(f);
    }
  }

  document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>