通过form表单上传文件获取后台传来的数据-CSDN博客

本文介绍如何使用jQuery和Ajax结合实现含文件的表单提交，并在后台获取返回值，确保文件上传成功。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

　　小伙伴是不是遇到过这样的问题，通过submit提交form表单的时候，不知怎么获取后台传来的返回值。有的小伙伴就会说你不会发送ajax，其实也会。假如提交的form表单中含有文件，怎么办？

步骤1：想要通过submit方式提交form表单，需要引入js

jquery.js

jquery-form.js

<script type="text/javascript" src="http://malsup.github.com/jquery.form.js" /></script>

步骤2：写一个form表单

<form name="serialNumber_importSerialNumber" id="serialNumber_importSerialNumber" method="post" enctype="multipart/form-data">
<div id="importSerialNumberDiv">
    <center>
        <br /> 请选择要导入的规则库文件：<input type="file" id="serialNumberFile" name="importSerialNumber" />
        <button class="layerButton" id="buttonSubmit">
            <span>确定</span>
        </button>
    </center>
</div>
</form>

步骤3：js获取从后台返回的值

var serialNumberUrl = "";
$(function() {
    $("#buttonSubmit").bind("click", function() {
        var serialNumberFileVal = $("#serialNumberFile").val();
        serialNumberFileVal = serialNumberFileVal.substring(serialNumberFileVal.lastIndexOf('.') + 1);
        if (serialNumberFileVal != "xml") {
            showAlertDialog("提示", "请选择xml文件上传");
            return false;
        } else {
            serialNumberUrl = "${basePath}/genuineSerialNumberManagementAction_importSerialNumber.do?disc=baseLineTemplate";
            document.serialNumber_importSerialNumber.action = serialNumberUrl;
            serialNumber_importSerialNumber.submit();
        }
    });
     /** 验证文件是否导入成功  */  
    $("#serialNumber_importSerialNumber").ajaxForm(function(data){
        setMessage(data);
    });
});