ajaxfileupload.js鎬庝箞瀹炵幇涓婁紶鏂囦欢鍔熻兘
瑕佸疄鐜版枃浠朵笂浼犲姛鑳斤紝鍙互浣跨敤ajaxfileupload.js鎻掍欢鏉ョ畝鍖栨枃浠朵笂浼犵殑杩囩▼銆備互涓嬫槸涓€涓畝鍗曠殑绀轰緥浠g爜鏉ユ紨绀哄浣曚娇鐢╝jaxfileupload.js瀹炵幇鏂囦欢涓婁紶鍔熻兘锛?/p>
- 棣栧厛锛屽湪html鏂囦欢涓紩鍏jaxfileupload.js鎻掍欢锛?/li>
<script src="ajaxfileupload.js"></script>
- 鎺ヤ笅鏉ワ紝鍒涘缓涓€涓笂浼犳枃浠剁殑琛ㄥ崟锛屽苟娣诲姞涓€涓笂浼犳寜閽細
<form id="uploadForm" action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="file" id="file">
<input type="button" value="Upload" onclick="uploadFile()">
</form>
- 鐒跺悗锛屽湪JavaScript鏂囦欢涓紪鍐欎笂浼犳枃浠剁殑鍑芥暟锛?/li>
function uploadFile() {
// 鑾峰彇鏂囦欢杈撳叆妗嗕腑閫夋嫨鐨勬枃浠?/span>
var file = document.getElementById('file').files[0];
// 浣跨敤ajaxfileupload.js鎻掍欢涓婁紶鏂囦欢
$.ajaxFileUpload({
url: 'upload.php', // 涓婁紶鏂囦欢鐨勫悗绔帴鍙?/span>
secureuri: false,
fileElementId: 'file',
dataType: 'json',
success: function (data, status) {
// 鏂囦欢涓婁紶鎴愬姛鍚庣殑澶勭悊閫昏緫
console.log('File uploaded successfully');
},
error: function (data, status, e) {
// 鏂囦欢涓婁紶澶辫触鍚庣殑澶勭悊閫昏緫
console.log('File upload failed');
}
});
}
- 鏈€鍚庯紝闇€瑕佸湪鍚庣缂栧啓涓€涓鐞嗘枃浠朵笂浼犵殑鎺ュ彛upload.php锛?/li>
<?php
if ($_FILES["file"]["error"] > 0) {
echo "Error: " . $_FILES["file"]["error"];
} else {
move_uploaded_file($_FILES["file"]["tmp_name"], "uploads/" . $_FILES["file"]["name"]);
echo "File uploaded successfully";
}
?>
浠ヤ笂灏辨槸浣跨敤ajaxfileupload.js瀹炵幇鏂囦欢涓婁紶鍔熻兘鐨勭畝鍗曠ず渚嬨€傚湪瀹為檯椤圭洰涓紝鍙互鏍规嵁鍏蜂綋闇€姹傚鏂囦欢涓婁紶鐨勫姛鑳借繘琛屾墿灞曞拰浼樺寲銆?/p>
相关问答