利用jQuery异步上传文件的插件用法详解


Posted in jQuery onJuly 19, 2017

现在想实现用ajax来上传文件的功能,但是却发现Jquery自带的ajax方法只能上传文件名,而不能上传文件;用form提交虽然能够上传文件,但是却要刷新页面。。。多方查找下找到了一个可用的jQuery插件,刚好可以满足异步上传文件的要求。

代码

jquery.form.js

用法

这个插件是基于表单提交的,我们只要正常的写一段提交文件的表单,如:

<form id="myForm" action="comment.php" method="post" enctype="multipart/form-data">
  <input type="file" name="name" />
  <input type="submit" value="Submit Comment" />
</form>

然后在js中加上如下代码:

<html>
<head>
  <script src="jquery.js"></script>
  <script src="jquery.form.js"></script>
  <script>
    $(document).ready(function() {
      $('#myForm').ajaxForm(function(data) {
        alert(data);
      });
    });
  </script>
</head>

这样就可以监听表单的提交事件,把它变成ajax传送到后台,然后将后台返回的信息从data中获取。如此一来就可以用ajax通信来传输文件了。

以上所述是小编给大家介绍的利用jQuery异步上传文件的插件用法详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery用户头像裁剪插件cropbox.js使用详解
Jun 07 jQuery
jQuery validata插件实现方法
Jun 25 jQuery
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
springmvc接收jquery提交的数组数据代码分享
Oct 28 jQuery
jquery 实现拖动文件上传加载进度条功能
Mar 18 jQuery
jQuery实现的监听导航滚动置顶状态功能示例
Jul 23 jQuery
jQuery 同时获取多个标签的指定内容并储存为数组
Nov 20 jQuery
jQuery动态操作表单示例【基于table表格】
Dec 06 jQuery
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 jQuery
JQuery常用选择器功能与用法实例分析
Dec 23 jQuery
jQuery实现简单QQ聊天框
Aug 27 jQuery
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 #jQuery
jquery版轮播图效果和extend扩展
Jul 18 #jQuery
jQuery扇形定时器插件pietimer使用方法详解
Jul 18 #jQuery
jquery插件canvaspercent.js实现百分比圆饼效果
Jul 18 #jQuery
jQuery remove()过滤被删除的元素(推荐)
Jul 18 #jQuery
jQuery之动画ajax事件(实例讲解)
Jul 18 #jQuery
详解jQuery中关于Ajax的几个常用的函数
Jul 17 #jQuery
You might like
php preg_filter执行一个正则表达式搜索和替换
2012/02/27 PHP
php从完整文件路径中分离文件目录和文件名的方法
2015/03/13 PHP
浅析PHP关键词替换的类(避免重复替换,保留与还原原始链接)
2015/09/22 PHP
PHP常用工具类大全附全部代码下载
2015/12/07 PHP
jQuery中的.bind()、.live()和.delegate()之间区别分析
2011/06/08 Javascript
javascript获取浏览器类型和版本的方法(js获取浏览器版本)
2014/03/13 Javascript
jquery操作 iframe的方法
2014/12/03 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
2015/05/19 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
2015/09/06 Javascript
js变量提升深入理解
2016/09/16 Javascript
Angular 中 select指令用法详解
2016/09/29 Javascript
Bootstrap基本组件学习笔记之按钮组(8)
2016/12/07 Javascript
js a标签点击事件
2017/03/30 Javascript
浅谈JS封闭函数、闭包、内置对象
2017/07/18 Javascript
vue init webpack myproject构建项目 ip不能访问的解决方法
2018/03/20 Javascript
vue keep-alive请求数据的方法示例
2018/05/16 Javascript
vue中轮训器的使用
2019/01/27 Javascript
9种方法优化jQuery代码详解
2020/02/04 jQuery
javascript设计模式 ? 外观模式原理与用法实例分析
2020/04/15 Javascript
35个Python编程小技巧
2014/04/01 Python
Python获取Linux系统下的本机IP地址代码分享
2014/11/07 Python
Python列表计数及插入实例
2014/12/17 Python
spyder常用快捷键(分享)
2017/07/19 Python
详解python中的生成器、迭代器、闭包、装饰器
2019/08/22 Python
使用Matplotlib 绘制精美的数学图形例子
2019/12/13 Python
python3 kubernetes api的使用示例
2021/01/12 Python
css3 仿写阿里云水纹效果的示例代码
2018/02/10 HTML / CSS
HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能
2018/04/23 HTML / CSS
英国剑桥包官网:The Cambridge Satchel Company
2016/08/01 全球购物
美国最大的在线水培用品商店:GrowersHouse.com
2018/08/14 全球购物
美国职棒大联盟的官方手套、球和头盔:Rawlings
2020/02/15 全球购物
俄罗斯品牌服装和鞋子在线商店:BRIONITY
2020/03/26 全球购物
抽象方法、抽象类怎样声明
2014/10/25 面试题
班级入场式解说词
2014/02/01 职场文书
项目合作协议书
2014/04/16 职场文书
医药公司采购员岗位职责
2014/09/12 职场文书