這篇文章主要介紹“PHP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳”，在日常操作中，相信很多人在PHP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳問(wèn)題上存在疑惑，小編查閱了各式資料，整理出簡(jiǎn)單好用的操作方法，希望對(duì)大家解答”P(pán)HP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳”的疑惑有所幫助！接下來(lái)，請(qǐng)跟著小編一起來(lái)學(xué)習(xí)吧！

牙克石ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書(shū)未來(lái)市場(chǎng)廣闊！成為創(chuàng)新互聯(lián)建站的ssl證書(shū)銷售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：028-86922220（備注：SSL證書(shū)合作）期待與您的合作！

我們?cè)诒疚闹杏玫揭粋€(gè)Ajax表單提交插件：jqery.form.js，有高人修改了幾行代碼并改名為：jquery.wallform.js，直接拿來(lái)用。

HTML

我們?cè)陧?yè)面上放置一個(gè)form表單，使用post提交到后臺(tái)php處理程序upload.php，注意enctype屬性設(shè)置要支持文件上傳。#preview用來(lái)顯示上傳完畢后的圖片。關(guān)于css樣式設(shè)置本文不加說(shuō)明，請(qǐng)參照下載包的源碼。

當(dāng)點(diǎn)擊按鈕“添加圖片”后，彈出選擇文件對(duì)話框，選擇要上傳的圖片后，觸發(fā)change事件。然后表單#imageform調(diào)用jquery.wallform.js的ajaxForm()方法，將表單數(shù)據(jù)提交給后臺(tái)PHP處理，并根據(jù)返回結(jié)果處理頁(yè)面元素的展示。如果上傳成功，圖片會(huì)一張張排列顯示在頁(yè)面上。關(guān)于ajaxForm()的使用可以參照本站文章：Ajax表單提交插件jqery form。

$(function(){$('#photoimg').die('click').live('change', function(){var status = $("#up_status");var btn = $("#up_btn");$("#imageform").ajaxForm({target: '#preview', beforeSubmit:function(){status.show();btn.hide();}, success:function(){status.hide();btn.show();}, error:function(){status.hide();btn.show();} }).submit();});});

PHP

upload.php處理圖片上傳，并將上傳好的圖片保存在uploads/目錄，注意該目錄要有寫(xiě)權(quán)限。首先需要檢測(cè)是否為POST方式提交，然后判斷圖片格式、圖片大小是否符合要求，然后使用move_uploaded_file()上傳圖片，并將圖片重命名，格式為：time().rand(100,999)。

$path = "uploads/";$extArr = array("jpg", "png", "gif");if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){$name = $_FILES['photoimg']['name'];$size = $_FILES['photoimg']['size'];if(empty($name)){echo '請(qǐng)選擇要上傳的圖片';exit;}$ext = extend($name);if(!in_array($ext,$extArr)){echo '圖片格式錯(cuò)誤！';exit;}if($size>(100*1024)){echo '圖片大小不能超過(guò)100KB';exit;}$image_name = time().rand(100,999).".".$ext;$tmp = $_FILES['photoimg']['tmp_name'];if(move_uploaded_file($tmp, $path.$image_name)){echo '';}else{echo '上傳出錯(cuò)了！';}exit;}//獲取文件類型后綴function extend($file_name){$extend = pathinfo($file_name);$extend = strtolower($extend["extension"]);return $extend;}

當(dāng)然，實(shí)際應(yīng)用中，可以與數(shù)據(jù)庫(kù)以及用戶中心結(jié)合，將用戶上傳的圖片保存在數(shù)據(jù)表中，具體應(yīng)用大家可以自行研究。

到此，關(guān)于“PHP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí)，請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編會(huì)繼續(xù)努力為大家?guī)?lái)更多實(shí)用的文章！

文章題目：PHP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳-創(chuàng)新互聯(lián)
分享網(wǎng)址：http://weahome.cn/article/cchgjj.html