大多上传文件的时候，都是使用表单的方式进行提交的。

使用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获取文件之后，就可以调用后台上传的方法了。

虽然可以实现，但$冲突的问题还是需要解决。对于一种功能的实现，只有掌握多种实现方式，才能实现无困难编码，才能挑选高性能的方案。