Php不能与ajax一起工作 - Php is not working with ajax

Php is not working with ajax

本文关键字：一起工作 ajax 不能 Php | 更新日期: 2023-09-27

html code

<form  method="post" name="file_upload" enctype="multipart/form-data"  id="file_upload">
    <input type="file"  id="_file" name="_file"> <br>
    <input type="button"  id="button" value="upload"/> <br>
    <progress id="p_bar" value="0" max="100" style="width:300px;"> </progress>
</form>
<p id="status"> </p>
<script src="final.js" > </script>

var sfile = document.getElementById('_file') ;
var btn = document.getElementById('button') ;
var f_upload= document.getElementById('file_upload') ; 
var pbar = document.getElementById('p_bar') ;
var sbar = document.getElementById('status') ;
function upload () {
    if(sfile.files.length==0) {
    alert("files isn't select ") ;                      
    }
    var s_file = sfile.files[0] ;
    var formdata = new FormData () ;
    formdata.append( 'selected file ',s_file) ;
    var ajax = new XMLHttpRequest () ;
    ajax.upload.addEventListener("progress", progress  , false ) ; 

    function progress (event) {
        var percent = (event.loaded / event.total) * 100 ; 
        pbar.value = Math.round(percent) ;
        sbar.innerHTML = Math.round(percent)+"%.........uploaded" ;
    }
    ajax.open("POST", "final.php") ;
    ajax.send(formdata) ;
}

btn.addEventListener("click", upload , false ) ;`

PHP

<?php
$file_name = $_FILES['_file']['name'] ;
$file_temp = $_FILES['_file']['tmp_name'] ;
$file_size = $_FILES['_file']['size'] ;
$file_type = $_FILES['_file']['type'] ;
$file_error = $_FILES['_file']['size'] ;
$file_destination = "upload/".basename($file_name) ;

if( move_uploaded_file($file_temp, $file_destination) ) {
    echo "file uploaded" ;
}
else {
    echo " file is failed to upload " ;
}

在这些没有工作的php。如果我只把echo放到主页面仍然没有输出。此外，如果我们在PHP中捕获HTML中的名称标签，那么为什么要在ajax中使用send函数。比如ajax.send(formdata)

这里的问题是你不是在寻找ajax response .试试这个:

<script>
    var sfile = document.getElementById('_file');
    var btn = document.getElementById('button');
    var f_upload= document.getElementById('file_upload');
    var pbar = document.getElementById('p_bar');
    var sbar = document.getElementById('status');
    var ajax = null;
    function upload () {
        if(sfile.files.length==0) {
            alert("files isn't select ");
            return;
        }
        var s_file = sfile.files[0];
        var formdata = new FormData();
        formdata.append('_file',s_file);//your key is _file
        ajax = new XMLHttpRequest();
        ajax.upload.addEventListener("progress", progress  , false);
        ajax.open("POST", "final.php");
        ajax.onreadystatechange = OnStateChange;
        ajax.send(formdata);
    }
    btn.addEventListener("click", upload , false);
    function progress (event) {
        var percent = (event.loaded / event.total) * 100;
        pbar.value = Math.round(percent);
        sbar.innerHTML = Math.round(percent)+"%.........uploaded";
    }
    function OnStateChange () {
        if (ajax.readyState == 4 && ajax.status == 200) {
            var resp = ajax.responseText;
            alert(resp);
        }
    }
</script>