フロントエンドは formdata を使用してフォーム フォームを非同期にアップロードし、バックエンド (php) から取得した詳細なチュートリアルは個人的なテストに利用できます (ソース コードが添付されています)。

この記事では主に、フォームフォームを非同期にアップロードするための formdata のフロントエンドの使用法と、個人的なテストに使用できるバックエンド (php) から取得した詳細なチュートリアルを紹介します (ソースコードが添付されています)。値を今すぐ​​みんなと共有して、困っている友達と共有してください

フロントエンドでフォームを非同期に送信したい場合は、formdata メソッドを使用して送信することをお勧めします。これは、formdata がフォーム全体を送信できるためです。送信フォームに

ファイルを含めます (これが重要なポイントであり、他の多くのメソッドは完了できません)。

フロントエンド コードの重要な部分は次のとおりです:

<form id="form"  method="post" enctype="multipart/form-data">
<input type="text" name="name" />
<input type="file" name=img />
<input type="button" onclick="submit()"/>
</form>
<script>
function submit(){

var myform  = document.getElementById("form")
var formfile = new FormData(myform);
var author = ["sony", "god", "JB"];
formfile.append("author",  author);    //此处是在原表单上在增加一些字段, 后端用$_POST["author"]就可以取得相应的值
var xml = new XMLHttpRequest();
xml.onreadystatechange =  function(){
        if(xml.readyState == 4 &&  xml.status == 200){
                var result = JSON.parse(xml.responseText);
               console.log(result) //在打印台就可以看到相应的表单值
        }
}
xml.open("POST",  "你要提交到那个服务器地址", true);
xml.send( formfile );
}
</script>

バックグラウンドでは php を使用します。他の言語でも同じアイデアを参照できます get.php

<?php 
$name = $_POST["name"];
$author = $_POST[&#39;author"];
$file = $_FILES["img"];
move_uploaded_file($file[&#39;tmp_name&#39;], $file["name"]);  //上传到和get.php同一级目录的服务器上
//至此,前端异步上传的name 和author 和 img 都已经取到.后续可以根据自己的需要去做其他事情
?>

遭遇する落とし穴:

form.file.append(" author", author) など、必要な追加の値を追加できますアップロードしますが、作成者の値、配列、文​​字列は個人的なテストに使用できますが、フォームを追加したい場合は、formfile.append("form", form) のように機能しません。バックグラウンドで $_POST["form "] 要素オブジェクトから取得します

以上がフロントエンドは formdata を使用してフォーム フォームを非同期にアップロードし、バックエンド (php) から取得した詳細なチュートリアルは個人的なテストに利用できます (ソース コードが添付されています)。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。