jQuery – AJAX 傳遞表單或是上傳檔案

一般上傳檔案使用AJAX比較不容易做到
有個套件很方便,還能回傳上傳進度
那就是使用 jquery.form 這支plugin 啦!
http://malsup.com/jquery/form/

官方使用

$('#myFormId').ajaxForm();

但我通常習慣使用

$(".button").on("click", function (){
    $(".form1").ajaxSubmit(); 
})

這樣點擊某樣物件後才觸發送出表單
一方面可能我們需要做加密後才送出等等之類的….
基本上我覺得這樣比較有彈性

 

 

選用參數
比較常用到的是

uploadProgress : function (event, position, total, percentComplete)
//這四個參數可以讓你看到上傳進度與百分比喔

 

 

API 參考
http://malsup.com/jquery/form/#api
其中

$('#myFormId').resetForm();

可以讓你送出後自己重置表單

Comments

  1. 不好意思想請問是否有範例檔案可以參考,現在剛好需要做類似功能
    希望能夠先將檔案上傳並不刷新頁面。

    • 基本上這個外掛滿簡單的,目前沒打算寫範例耶…不好意思。這部分需要一些AJAX相關知識技術。可以多參考其他網站的分享喔

發表迴響