javascript 如何从php文件名到 AJAX xhttp js

yqhsw0fo  于 2022-12-28  发布在  Java
关注(0)|答案(1)|浏览(93)

下面是js和html
我想得到p标签中的文件名。怎么做?
我尝试与上述代码,但仍然不工作.

<div>
  <p id="filename"></p>
  <input type="file" name="file" id="file">
  <input type="button" id="btn_uploadfile" 
     value="Upload" 
     onclick="uploadFile();" >
</div>
<hr><br><br>
<script>
function uploadFile() {

var files = document.getElementById("file").files;

if(files.length > 0 ){

   var formData = new FormData();
   formData.append("file", files[0]);

   var xhttp = new XMLHttpRequest();

   // Set POST method and ajax file path
   xhttp.open("POST", "includes/upload.php", true);

   // call on request changes state
   xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {

        var response = this.responseText;
        var filenamenew = this.filenamenewText;
        document.getElementById("filename").innerHTML = filenamenew;
        var input = document.getElementById("btn_uploadfile");
        var a = document.getElementById("links");
        if(response == 1){
           alert("Upload successfully.");
           input.value = "Uploaded";
           input.disabled = 'true';
           var input = document.getElementById("file");
           input.disabled = 'true';
        }else{
           alert("File not uploaded.");
        }
      }
   };

   // Send request with data
   xhttp.send(formData);

}else{
   alert("Please select a file");
}

}
</script>

PHP代码在这里

<?php

if(isset($_FILES['file']['name'])){
   // file name
   $filename = $_FILES["file"]["name"];
   $newfilename = round(microtime(true)) . '_original_' . $filename ;
   
   // Location
   $location = '../uploads/'.$newfilename;

   // file extension
   $file_extension = pathinfo($location, PATHINFO_EXTENSION);
   $file_extension = strtolower($file_extension);

   // Valid extensions
   $valid_ext = array("apk","aab","ipa");

   $response = 0;
   $filenamenew = 0;
   if(in_array($file_extension,$valid_ext)){
      // Upload file
      if(move_uploaded_file($_FILES['file']['tmp_name'],$location)){
         $response = 1;
         $filenamenew = $filenamenew;
      } 
   }

   echo $response;
   exit;
   echo "<p>$filenamenew<p>";
   exit;
}
?>

在这段代码中,它说在p标记中是未定义

iklwldmw

iklwldmw1#

要使用JavaScript中的XmlHttpRequest(XHR)对象将文件名从PHP脚本获取到 AJAX 请求,可以执行以下步骤:
在处理文件上载的PHP脚本中,使用$_FILES全局变量获取文件信息,包括文件名。例如:

$file = $_FILES['file'];
$fileName = $file['name'];

在 AJAX 请求中,将文件名作为响应的一部分发送回客户端。您可以将文件名设置为响应中返回的对象的属性,如下所示:

echo json_encode(array('fileName' => $fileName));

在处理 AJAX 响应的JavaScript代码中,使用XHR对象的responseText属性获取字符串形式的响应数据,然后使用JSON.parse函数将响应数据解析为JavaScript对象。例如:

var response = JSON.parse(xhttp.responseText);
var fileName = response.fileName;

然后可以使用fileName变量在JavaScript代码中访问该文件名。
同样值得注意的是,您可能需要将PHP脚本响应的Content-Type标头设置为application/json,以便JSON.parse函数正确解析响应数据。您可以通过向PHP脚本添加以下行来实现这一点:

header('Content-Type: application/json');

相关问题