ajax提交form表單

ajax和form表單有很多有趣的互動,ajax提交form表單就是其中一種,這種方法主要是用來提交帶圖數據的。
html頁面,我把圖片單獨放到form表單內,其他數據放到form外即可

       <form method="post" enctype="multipart/form-data" id="testForm">
             <input type="file" name="problemImage" id="file" >
  </form>

js



    var formData = new FormData(document.getElementById("testForm"));//表單id
    var problemTitle=$("#problemTitle").val();
    var problemDescribe = $("#problemDescribe").val();
    if ($(".is-other").css("display") == "block") {
        problemType = $(".is-other").val();
    }
    formData.append("problemTitle", problemTitle);
    formData.append("problemDescribe", problemDescribe);
    formData.append("userId", userId);
        $.ajax({
            url: '',
            type: 'post',
            data: formData,
            async: false,//同步加載
            contentType: false,//防止jq對formdata操作,默認爲ture
            processData: false,//防止序列化操作
            success: function (result) {
   
            }
        });
    }

後臺用MultipartFile file接收圖片即可

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章