以下是一个使用jQuery上传文件到后端PHP的完整代码示例:
HTML代码:
<!DOCTYPE html>
<html>
<head>
<title>文件上传示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<h1>文件上传示例</h1>
<form id="upload-form" enctype="multipart/form-data">
<input type="file" name="file" id="file-input">
<button type="submit" id="upload-btn">上传</button>
</form>
<div id="response"></div>
<script>
$(document).ready(function() {
$('#upload-form').submit(function(e) {
e.preventDefault();
var formData = new FormData(this);
$.ajax({
url: 'upload.php',
type: 'POST',
data: formData,
processData: false,
contentType: false,
success: function(response) {
$('#response').html(response);
},
error: function() {
$('#response').html('上传失败');
}
});
});
});
</script>
</body>
</html>
PHP代码(upload.php):
php复制代码
<?php
if ($_FILES['file']['error'] === UPLOAD_ERR_OK) {
$fileTmpPath = $_FILES['file']['tmp_name'];
$fileName = $_FILES['file']['name'];
$fileSize = $_FILES['file']['size'];
$fileType = $_FILES['file']['type'];
// 指定文件存储路径
$uploadDir = 'uploads/';
$filePath = $uploadDir . $fileName;
// 将文件从临时路径移动到指定路径
if (move_uploaded_file($fileTmpPath, $filePath)) {
echo '文件上传成功';
} else {
echo '文件上传失败';
}
} else {
echo '文件上传错误';
}
?>
在上述代码中,我们使用了jQuery的$.ajax
方法来发送异步请求到后端PHP文件upload.php
。在PHP文件中,我们首先检查文件上传是否成功(通过$_FILES['file']['error']
判断),然后获取文件的临时路径、名称、大小和类型。接下来,我们指定了文件的存储路径,并使用move_uploaded_file
函数将文件从临时路径移动到指定路径。最后,根据移动文件的结果,返回相应的上传成功或失败信息。
请确保在服务器上创建一个名为uploads
的文件夹,用于存储上传的文件。