圖片的type='file'在表單數據中不能直接獲取,可以將他們的data放在一個集合中,然後再上傳
<form id="formFile" name="formFile" method="post" enctype="multipart/form-data"> <table style="border: 0px;margin: 20px;"> <tr> <td> <span class="allstyle">公司LOGO</span> </td> <td> <input type="file" class="pecture" id="upload_img" οnchange="onUploadImgChange(this)" > </td> </tr> <tr> <td> <span class="allstyle">LOGO預覽</span> </td> <td style="width: 100px;height: 100px;display: block;"> <div id="preview_wrapper"> <div id="preview_fake"> <img id="companyLOGO" οnlοad="onPreviewLoad(this)"/> </div> </div> </td> </tr> <tr> <td> <span class="allstyle">公司版權號</span> <td> <input type="text" name="comcopyright" class="companyCopyright" value=""/> </td> </tr> </table> <input type="submit" class="allUpload" value="上傳" style="margin-left: 100px;"> </form>
js上傳
$(function(){ var dateArray =[]; $('form input[type=submit]').click(function(){ //判斷是否有選擇上傳文件 var imgPath = $("#upload_img").val(); if (imgPath == "") { alert("請選擇上傳圖片!"); return; } //判斷上傳文件的後綴名 var strExtension = imgPath.substr(imgPath.lastIndexOf('.') + 1); if (strExtension != 'jpg' && strExtension != 'gif'&& strExtension != 'png' && strExtension != 'bmp') { alert("請選擇圖片文件"); return; } $("input[type='text']").each(function () { var dateSet = {}; dateSet.img = $("#upload_img").val(); dateSet.name = $(".companyName").val(); dateSet.phone = $(".companyPhone").val(); dateSet.qq = $(".companyQQ").val(); dateSet.address = $(".companyAddress").val(); dateSet.copyright = $(".companyCopyright").val(); dateArray.push(dateSet); }); var JsonData = JSON.stringify(dateArray); console.log(JsonData) $.ajax({ type:"POST", url:'user.php', async:true, dataType: 'json', data:JsonData, success:function(response){ $("#companyLOGO").empty(); $("#companyLOGO").html(response); $("#companyLOGO").show(); $("#responseText").text(response); console.log($("#responseText").text(response)); } }); }); }); </script>