html、修改html
<div class="template-upload"> <span>模版樣式:</span> <button type="button" class="choose" id="btn">選擇模板</button> <input type="file" accept=".pptx,.pptx" name="file" style="display: none" id="files" multiple="multiple"> <button id="upload" class="choose">上傳模板文件</button> <label id="filename" class="filename" for=""></label> </div>
js代碼
ajax
type,
data,
success....ajax
//文件點擊選擇文件模板 $("#btn").click(function(){ $("#files").click(); }); //文件顯示已選擇文件名 $("#files").change(function(){ var filetmpname = $("#files").val(); filename = filetmpname.split("\\").pop(); $("#filename").text("已選擇: "+filename); }); //文件點擊上傳 $("#upload").click(function () { var formdata = new FormData(); formdata.append("file", $('#files')[0].files[0]); $.ajax({ type: "post", url: "/template", data: formdata, contentType: false, processData: false, dataType: "json", eads : {'content-type' : 'application/x-www-form-urlencoded'}, success: function (data) { if(data.code==0){ alert(data.message) //在上傳模版的同時,請求後臺獲取模版ID //setTimeout(getTemplate_name//(filename),10000); } else{ alert(data.errmsg); } }, error: function () { alert("模板上傳失敗!"); } }); });