方法1：使用ajax，通過formdata傳參

//注意：FormData只兼容到IE10 var formData = new FormData(); var file = $('.import-file-btn').get(0).files[0]; formData.append('file', file); formData.append('id', id); formData.append('name', name);$.ajax({url: 'user/validate_import_data',type: 'POST',cache: false,data: formData,processData: false,contentType: false,dataType: "json",success: function (res) {},error: function (XmlHttpRequest, textStatus, errorThrown) {},complete: function () {} });

方法2：使用jquery.form.js

html

<!--HTML--> <form id="import-file-form" action="user/validate_import_data" method='post' enctype='multipart/form-data' target="form"><input type="file" name="file" class="import-file-btn" title=""><input type="hidden" name="id"><input type="hidden" name="name"> </form>

?js

//注意：可兼容IE瀏覽器，推薦 $('#import-file-form').ajaxSubmit({dataType: 'json',beforeSerialize: function () {//此處可對參數進行處理},success: function (res) {},error: function (XmlHttpRequest, textStatus, errorThrown) {},complete: function () {} });

方法3：使用form表單上傳，通過iframe接收回調

html

<form id="import-file-form" action="user/validate_import_data" method='post' enctype='multipart/form-data' target="form"> <!--注意target不能缺少--><input type="file" name="file" class="import-file-btn"><input type="hidden" name="id"><input type="hidden" name="name"><button type="submit" id="submit-import-file" style="display:none">提交</button> </form> <iframe name="form" id="import-file-iframe" style="display:none"></iframe>

js

//注意：當http請求成功時，即狀態碼為200時可正常處理邏輯。 //但是狀態碼不為200時，沒有方法識別到當前請求出錯了，不推薦 $("#submit-import-file").click(); $("#import-file-iframe").load(function(){var text = $(this).contents().find("body").text(); //獲取到的是json的字符串console.log(text);var res= $.parseJSON(text); //json字符串轉換成json對象console.log(res); });

總結

以上是生活随笔為你收集整理的JAVASCRIPT 上传文件的几种方式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。