前端頁面代碼 <!-- enctype 定義form要上傳文件類型--> <form action="" method="post" id="t" enctype="multipart/form-data"> <!-- multiple 作用是可以同時選中多個文件，多張圖片 accept 指定inp ...
-
前端頁面代碼
<!-- enctype 定義form要上傳文件類型-->
<form action="" method="post" id="t" enctype="multipart/form-data">
<!--
multiple 作用是可以同時選中多個文件，多張圖片
accept 指定input可以上傳那種類型
onchange 當本元素動的時候，點擊也屬於 調用abs函數
-->
<input type="file" name='tables_a[]' id="tables" multiple accept="image/*" onchange="abs()">
<!-- 隱藏域 在上傳完文件以後，把文件的地址賦給input tables_2 的值 -->
<input type="hidden" name='tables' id='tables_2'>
<!-- 提交表單 -->
<input type="submit" value="提交">
</form>
<!--jquery 必須有，一定要放在執行js的上方，可以是頭部-->
<script src="/js/jquery-1.8.3.js"></script>
<script>
/*定義函數*/
function abs(){
/*獲得文件*/
var fileArray = document.getElementById('tables').files[0];
/*初始化 FormData 對象 文件處理對象 序列化表單數據*/
var formData = new FormData();
/*給對象中添加文件信息，沒有對象或者沒有文件信息後臺是得不到的*/
formData.append('file', fileArray);
/*jquery ajax 方法*/
$.ajax({
url: "ceshiphp.php",/*傳向後臺伺服器文件*/
type: 'POST', /*傳遞方法 */
data:formData, /*要帶的值，在這裡只能帶一個formdata ，不可以增加其他*/
//傳遞的數據
dataType : 'json', //傳遞數據的格式
async:false, //這是重要的一步，防止重覆提交的
cache: false, //設置為false，上傳文件不需要緩存。
contentType: false,//設置為false,因為是構造的FormData對象,所以這裡設置為false。
processData: false,//設置為false,因為data值是FormData對象，不需要對數據做處理。
success: function (responseStr){
if(responseStr.code != 0){
alert('上傳成功');
$('#tables_2').val(responseStr.data);
}else{
alert('上傳失敗');
}
},
error: function () {
alert("上傳錯誤！");
}
});
}
</script>
2.後端頁面代碼
echo "<pre>";
print_r($_FILES);
echo "</pre>";
列印出以下內容，
name 文件名稱
type 文件類型
tmp_name 文件臨時地址
erro 錯誤編碼
size 文件大小
/*得到文件名稱並且賦值給$name變數*/
$name = $_FILES['fileArray']['name'];
/*截取文件尾碼並複製給$last*/
$last = substr($name,strrpos($name,'.'));
/*使用時間戳修改文件名稱連接尾碼並且複製給$name*/
$name = date('YmdHis').rand(10000,99999).$last;
/*定義要傳文件的位置路徑*/
$address = ROOT_PATH.'/upload/'.$name;
/*使用函數move_uploaded_file 移動臨時文件到定義好的地址*/
if(move_uploaded_file($_FILES['fileArray']['tmp_name'],$address)){
echo 1;
}else{
echo 0;
}
