盛夏的果实 发表于 2021-7-17 09:17:47

利用JQuery的ajax请求实现文件上传

今天给大家介绍一下如何利用JQuery的ajax请求实现文件上传功能。
主要需要引入一个js文件,然后调用js文件中的ajaxFileUpload请求就可以实现异步文件上传机制了。
第一步:引入js文件名称为:ajaxfileupload.js 下载地址:点击打开链接
第二步:编写<input type="file" name="file" id="file"/>点击上传文件。
第三步:编写ajaxFileUpload异步请求,并处理请求结果。
下面给出完整的例子:
<html>
<head>
    <title>利用JQuery的ajax请求实现文件上传</title>
</head>
<body>
    <input type="file" name="file1" id="file1"/>
    <button type="button" id="submitId">点击上传<button>   
<script src="js/jquery.js"></script>   
<script src="js/ajaxfileupload.js"></script>
<script>
    $("#submitId").on("click",function () {
      $.ajaxFileUpload({
            url:'此处填写URL地址', //你处理上传文件的服务端
            secureuri:false,//是否启用安全机制
            fileElementId:'file1',//file的id
            dataType: 'application/json',//返回的类型
            success: function (data) {//调用成功时怎么处理
            alert("上传成功");
            }
      });
    });
</script>
</body>
</html>这里需要注意的是:jquery的文件要在ajaxFileUpload文件之前引入,否上传不成功。




文档来源:51CTO技术博客https://blog.51cto.com/u_8865295/3114553
页: [1]
查看完整版本: 利用JQuery的ajax请求实现文件上传