ajax异步上传文件插件ajaxfileupload

最新推荐文章于 2025-12-13 22:02:08 发布

原创最新推荐文章于 2025-12-13 22:02:08 发布 · 402 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #异步 #上传

文件上传专栏收录该内容

4 篇文章

订阅专栏

本文介绍如何使用ajaxfileupload插件实现文件的异步上传功能，并展示了具体的JavaScript代码示例，包括如何设置URL、文件ID及数据类型等。

要使用ajax异步的方式传递文件的话我们可以使用js插件ajaxfileupload,插件可以实现提交表单中的file对象,并且同时还能传递参数.
使用方法如下
首先页面中引入插件

<script src="${ctx}/static/js/ajaxfileupload.js"></script>

    $('#fileToUpload').on('change', function() {  
        $.ajaxFileUpload({  
            url:'../FileUploadServlet',  
            secureuri:false,  
            fileElementId:'fileToUpload',//file标签的id  
            dataType: 'json',//返回数据的类型  
            data:{name:'logan'},//一同上传的数据  
            success: function (data, status) {  

            },  
            error: function (data, status, e) {  

            }  
        });  
    });

<!-- 点击图片，打开文件选择器，确定，上传。(这是网络上的一个图片) -->  
<img id="upload" alt="" style="width: 200px; height: 200px"  
    src="">  

<!-- 隐藏file标签 -->  
<input id="fileToUpload" style="display: none" type="file" name="upfile">