Spring mvc多图片上传页面代码（采用aceadminui框架）

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ page pageEncoding="UTF-8" %>
<title>主题管理</title>


<link rel="stylesheet" href="../assets/css/jquery-ui.min.css"/>
<link rel="stylesheet" href="../assets/css/datepicker.css"/>
<link rel="stylesheet" href="../assets/css/ui.jqgrid.css"/>
<div class="row">
<div class="col-xs-12">

<%--添加新版本弹出框--%>

<div class="container">
    <div id="addBgImgModal" class="modal fade" tabindex="-1" style="margin: auto;">
        <div class="modal-dialog" style="width:400px; margin-top: 200px;">
            <div class="modal-content">
                <div class="modal-header no-padding">
                    <div class="table-header center">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            <span class="white">&times;</span>
                        </button>
                        添加主题
                    </div>
                </div>
                <div class="modal-body no-padding center" style="margin-top: 25px;">
                    <form:form id="addBgImgForm" class="form-horizontal" method="post" action="../addBgImg"
                               enctype="multipart/form-data" modelAttribute="uploadForm">
                        <div class="form-group">
                            <label class="col-sm-3 control-label no-padding-right"
                                   for="name">APP版本 </label>


                            <div class="col-sm-9">
                                <input type="text" id="name" name="name" placeholder=""
                                       class="col-xs-12 col-sm-7" readonly="true"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label no-padding-right"
                                   for="title"> 标题 </label>


                            <div class="col-sm-9">
                                <input type="text" id="title" name="title" placeholder=""
                                       class="col-xs-12 col-sm-7"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label no-padding-right"
                                   for="urlName"    > 背景图片 </label>


                            <div class="col-sm-9">
                                <input id="urlName" name="file" type="file" multiple=""
                                       class="col-xs-12 col-sm-7"/>
                            </div>
                        </div>
                        <div class="form-group">


                            <label class="col-sm-3 control-label no-padding-right"
                                   for="urlNames"   > 选中图片 </label>


                            <div class="col-sm-9">
                                <input id="urlNames" name="file" type="file" multiple=""
                                       class="col-xs-12 col-sm-7"/>
                            </div>
                        </div>


                    </form:form>
                </div>
                <div class="modal-footer center">
                    <button id="addBgImgBtn" class="btn btn-sm btn-primary" type="button" data-dismiss="modal">
                        <i class="ace-icon fa fa-check"></i>
                        提交
                    </button>
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    <button class="btn btn-sm btn-danger" data-dismiss="modal">
                        <i class="ace-icon fa fa-times"></i>
                        取消
                    </button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

</div>

<script type="text/javascript">
    var $path_base = "../..";//in Ace demo this will be used for editurl parameter
</script>


<!-- PAGE CONTENT ENDS -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
<!-- page specific plugin scripts -->
<script src="js/manage.js" type="text/javascript"></script>
<script src="js/dateFormat.js" type="text/javascript"></script>
<script src="js/jquery.form.js" type="text/javascript"></script>
<script src="js/ajaxfileupload.js" type="text/javascript"></script>

manage.js

var scripts = [null, "../assets/js/date-time/bootstrap-datepicker.min.js", "../assets/js/jqGrid/jquery.jqGrid.min.js", "../assets/js/jqGrid/i18n/grid.locale-cn.js", null]
ace.load_ajax_scripts(scripts, function () {

$(document).ready(function () {
        $("#addBgImgBtn").click(function () {
if( $('#urlName').val()==""){
    $('#addBgImgForm').ajaxSubmit({
        type: 'post',
        url: '../tplayertheme/inserts',
        success: function () {
            var grid_selector = "#bgImgTable";
            jQuery(grid_selector).jqGrid('setGridParam', {url: "../tplayertheme/query"}).trigger('reloadGrid');
            $('#addSuccessModal').modal('show');
        },
        error: function () {
            var grid_selector = "#bgImgTable";
            jQuery(grid_selector).jqGrid('setGridParam', {url: "../tplayertheme/query"}).trigger('reloadGrid');
            $('#addSuccessModal').modal('show');
          //  alert('添加主题失败，请重试');
        }
    })
}else{
    $('#addBgImgForm').ajaxSubmit({
        type: 'post',
        url: '../tplayertheme/insert',
        success: function () {
            var grid_selector = "#bgImgTable";
            jQuery(grid_selector).jqGrid('setGridParam', {url: "../tplayertheme/query"}).trigger('reloadGrid');
            $('#addSuccessModal').modal('show');
        },
        error: function () {
            var grid_selector = "#bgImgTable";
            jQuery(grid_selector).jqGrid('setGridParam', {url: "../tplayertheme/query"}).trigger('reloadGrid');
            $('#addSuccessModal').modal('show');
           // alert('添加主题失败，请重试');
        }
    })
}


        });
    });

)}