這次專案用到了圖片和檔案上傳到後臺，剛開始用的form表單，但是有一點不好的，就是點選上傳後會跳轉到action頁面，使用者體驗非常不舒服，所以就改為用ajax非同步上傳，現把我的心得上傳如下：

1、form表單

<form action="http://localhost....."  method="post" enctype="multipart/form-data">
        <input type="file" id="fileId" name="image" value="請上傳圖片" />
        <input type="hidden" id="hiddId" name="id" value="1"/>
        <input type="button" id="submit" value="上傳"/>
    </form>

後臺需要我上傳image 和id （enctype="multipart/form-data"這個必須寫）。

2、非同步上傳

<form action=""  method="post" enctype="multipart/form-data">
        <input type="file" id="fileId" name="image" value="請上傳圖片" />
        <input type="hidden" id="hiddId" name="id" value="1"/>
        <input type="button" id="submit" value="上傳"/>
    </form>
    <script type="text/javascript">
        $("#submit").click(function () {
            var a = new FormData();
            a.append("image", $("#fileId")[0].files[0]);
            a.append("id", 1);
            $.ajax({
                url:"http://localhost.....",
                xhrFields:{
                        withCredentials:true
                },
                type: "POST",
                cache: false,
                data: a,
                processData: false,
                contentType:false,
                async: false,
                success: function (result) {

                }
                //cache 上傳檔案不需要快取，所以設定false
                //processData 因為data值是FormData物件，不需要對資料處理
                //contentType 因為是由form表單構造的FormData物件，且已聲明瞭屬性enctype，所以為false
            })
        })
    </script>

好的，ok了，結束了，這就是關於我的專案中的檔案、圖片的非同步上傳和form表單上傳，謝謝！