JQuery ajaxFileUpload.js上传文件的使用问题

最新推荐文章于 2024-08-21 08:41:46 发布

forwardMyLife

最新推荐文章于 2024-08-21 08:41:46 发布

阅读量1.1k

点赞数 1

分类专栏： js 文章标签： ajaxFileUpload的使用

本文链接：https://blog.csdn.net/lucky_ly/article/details/94869746

版权

本文介绍如何在使用JQuery的框架中利用ajaxFileUpload.js进行异步文件上传，解决高版本JQuery的兼容问题。推荐了一个经过修改的ajaxFileUpload版本，支持额外参数传递，并提供SpringBoot后端接收文件的简易示例。

摘要由CSDN通过智能技术生成

使用在框架使用jq的情况下，使用ajaxFileUpload上传文件是一个不错的选择，ajaxFileUpload支持异步上传，采用的是隐藏的表单提交，避免了直接使用表单提交文件带来的问题，由于ajaxFileUpload依赖的jq版本较老，在jq_1.2.x之前了，所以用高版本的jq会报错，网上改写了ajaxFileUpload部分代码，以适配高低版本的jq，而且支持data来传另外的参数（之前的版本是只能用来上传文件的）。
这是我所使用的版本
https://github.com/carlcarl/AjaxFileUpload

demo

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <title>shiro</title>
    
        <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
        <script type="text/javascript" src="js/ajaxfileupload.js"></script>
    
    
        <!-- We support more than 40 localizations -->
        <script type="text/javascript" src="js/trirand/i18n/grid.locale-en.js"></script>
        <!-- This is the Javascript file of jqGrid -->
        <script type="text/javascript" src="js/trirand/jquery.jqGrid.min.js"></script>
        <!-- A link to a Boostrap  and jqGrid Bootstrap CSS siles-->
        <link rel="stylesheet" href=