使用jquery的ajax提交文件上传
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<form id="infoLogoForm" enctype='multipart/form-data'> <div class="cnt-updateWrapper" style="display: none"> <div> <div id="loadImg" class="cnt-img-content"> <img id="logo" class="ctn-uploadImg" src="${ctx}/static/images/u8385.png" draggable="false"> <div id="licenseBox" class="ctn-licence"> 点击我上传图片 <input type="file" id="ctn-input-file" name="file" accept="image/*" style="height:40px"></div> </div> </div> <div>上传成功后，请点击保存后才能生效</div> <div> <button id="infoLogoSaveBt" class="btn btn-default cnt-save" type="button">保存</button> </div> </div> </form> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<script> var uploading = false; $("#ctn-input-file").on("change", function () { if (uploading) { alert("文件正在上传中，请稍候"); return false; } $.ajax({ url: ctx + "/xxx/upload", type: 'POST', cache: false, data: new FormData($('#infoLogoForm')[0]), processData: false, contentType: "application/x-www-form-urlencoded", dataType: "json", beforeSend: function () { uploading = true; }, success: function (data) { if (data.code == 1) { $("#logo").attr("src", data.msg); } else { showError(data.msg); } uploading = false; } }); }); </script> |