大多上傳檔案的時候，都是使用表單的方式進行提交的。

使用form表單上傳檔案，也有很多種方式：

       1、介面上直接使用submit按鈕提交。這種方式可以實現效果但是沒有success事件。即，可以上傳檔案，但是沒有反饋資訊。
       2、使用jquery的form方法提交表單，這種提交方式，可以對錶單指定 onSubmit、success、error事件。這種方式會更加友好一些。

問題原因：通常使用Jquery就可以實現檔案的上傳。

       因為最近我們系統中的一些原因，導致Jquery的$與前臺架構bootstrap上的$有衝突，所以如果使用前臺框架之後，Jquery的$裡面沒有form方法。這就有些麻煩了。
       如果是用上面第一種方式提交檔案的話，那麼的確可以，就是不太友好。

所以為了解決上述遇到的問題，可以有兩種解決方案:
       1、解決衝突，畢竟JQuery和前臺框架都不可少的。
       2、重新尋找上傳表單的方法。

       經過查詢決定使用ajax進行檔案的上傳。網上一搜，找到了一個外掛，使用ajaxFileupload方法提交。

接下來看一個例項，簡單實現檔案的上傳。

示例

前臺：

<script type="text/javascript">
    /**
    * 上傳檔案（step.js中需要用的方法）
    * @param formTag
    */
    function uploadFile
 
(){
        $.ajaxFileUpload({ 
            method:"POST",
            url:ctx+"/leadtoQuestionTypes/ImportMongoMedia",            //需要連結到伺服器地址  
            secureuri:true,  
            fileElementId:'fileName',                        //檔案選擇框的id屬性 
            data:$('#picForm').serialize(),
            success: function
 
(data,s, status){ 
            //上傳成功之後的操作
            },error: function (data, status, e){ 
            //上傳失敗之後的操作
            }  
        });
    }
</script>

<form method="post" enctype="multipart/form-data">          
        <input type="file" id="fileName" name="fileName"  style="display:-webkit-inline-box;width: 180px;"/>
        <input type="button" style="width:70px;" src="image/backGroup.png" onclick="uploadFile()" value="上傳檔案">         
</form>

Controller(Spring MVC)

@RequestMapping("ImportMongoMedia")
public String ImportMongoMedia(@RequestParam(value = "fileName") MultipartFile file,
        HttpServletRequest request, HttpServletResponse response)
        throws UnsupportedEncodingException {

    MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
    //獲取上傳的檔案
    MultipartFile file1 = multipartRequest.getFile("fileName");

    //獲取檔名
    String fileName = file.getOriginalFilename();
    //獲取檔案路徑
    String logoRealPathDir = request.getSession().getServletContext()
            .getRealPath(fileName);

    File localFile = new File(logoRealPathDir);

    try {
        file1.transferTo(localFile);
    } catch (IllegalStateException | IOException e) {
        e.printStackTrace();
    }

    String MediaID = UUID.randomUUID().toString();

    LinkedHashMap map = new LinkedHashMap();

    MongoUtil mongoUtil = new MongoUtil();
    mongoUtil.uploadFile(localFile, MediaID, dbName, collectionName, map);

    return MediaID;
}

controller獲取檔案之後，就可以呼叫後臺上傳的方法了。

       雖然可以實現，但$衝突的問題還是需要解決。對於一種功能的實現，只有掌握多種實現方式，才能實現無困難編碼，才能挑選高效能的方案。