<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>檔案上傳</title>

<script src="static/js/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" src="static/js/jquery-form.js"></script>

<script type="text/javascript">

    function subimtBtn() {

        var form = $("form[name=fileForm]");

        var options  = {

            url:'${pageContext.servletContext.contextPath}/servlet/imageUploadServlet',

            type:'post',

            success:function(data)

            {

                var jsondata = eval("("+data+")");

                if(jsondata.error == "0"){

                    var url = jsondata.url;

                    alert(url)

                    $("#img").attr("src",url);

                }else{

                    var message = jsondata.message;

                    alert(message);

                }

            }

        };

        form.ajaxSubmit(options);

        //$("#fileForm").submit();

    }

</script>

</head>

<body>

            <div class="modal-body">  

                <form action='${pageContext.servletContext.contextPath}/servlet/imageUploadServlet' enctype="multipart/form-data" method="post" id="fileForm" name="fileForm">

                    <input type="file" name="filename">

                </form>  

            </div>  

            <div class="modal-footer">

                <button class="btn btn-primary"  onclick="subimtBtn();">提交</button>

            </div>  

    <div>

     <img alt="img" src="" id="img">

    </div>

</body>

</html>

　　 最近在專案中需要實現圖片的上傳，並且成功後返回圖片上傳儲存路徑，通過查詢資料探索研究，實現了專案功能需求，記在這方便自己以後查閱，也為有同樣需求的碼友分享，功能實現比較簡單，如果有好的建議和實現方法，還望多多指教。

主要將實現一下兩個功能： 
1、使用commons-fileupload實現檔案的上傳（包括圖片）； 
2、使用jquery-form.js實現表單提交成功的回撥函式。

頁面設計fileupload.jsp：

jquery.form.js 點選下載

http://files.cnblogs.com/files/blogs2014/jquery.form.rar