利用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模拟实现天猫购物车动画效果实例代码
May 25 jQuery
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 jQuery
全面解析jQuery中的$(window)与$(document)的用法区别
Aug 15 jQuery
jQuery实现简单的计时器功能实例分析
Aug 29 jQuery
jquery+css实现下拉列表功能
Sep 03 jQuery
利用jquery如何从json中读取数据追加到html中
Dec 01 jQuery
jQuery代码优化方法总结
Jan 29 jQuery
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
jQuery实现上下滚动公告栏详细代码
Nov 21 jQuery
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
Oct 26 jQuery
jQuery带控制按钮轮播图插件
Jul 31 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将任何格式视频转为flv的代码
2009/09/03 PHP
PHP如何抛出异常处理错误
2011/03/02 PHP
PHP常用设计模式之委托设计模式
2016/02/13 PHP
基于jquery的loading效果实现代码
2010/11/05 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
2015/06/24 Javascript
bootstrap表单示例代码分享
2017/05/18 Javascript
Bootstrap Table使用整理(二)
2017/06/09 Javascript
基于iScroll实现下拉刷新和上滑加载效果
2017/07/18 Javascript
js微信应用场景之微信音乐相册案例分享
2017/08/11 Javascript
Angular4表单验证代码详解
2017/09/03 Javascript
layui 优化button按钮和弹出框的方法
2018/08/15 Javascript
Layui组件Table绑定行点击事件和获取行数据的方法
2018/08/19 Javascript
小程序获取周围IBeacon设备的方法
2018/10/31 Javascript
Angular7创建项目、组件、服务以及服务的使用
2019/02/19 Javascript
详解js动态获取浏览器或页面等容器的宽高
2019/03/13 Javascript
JavaScript设计模型Iterator实例解析
2020/01/22 Javascript
[01:22:29]真视界:2019年国际邀请赛总决赛
2020/01/29 DOTA
node.js获取参数的常用方法(总结)
2017/05/29 Python
python实现杨辉三角思路
2017/07/14 Python
运动检测ViBe算法python实现代码
2018/01/09 Python
python DataFrame获取行数、列数、索引及第几行第几列的值方法
2018/04/08 Python
Python内存读写操作示例
2018/07/18 Python
Django ORM多对多查询方法(自定义第三张表&amp;ManyToManyField)
2019/08/09 Python
Python PO设计模式的具体使用
2019/08/16 Python
Python使用get_text()方法从大段html中提取文本的实例
2019/08/27 Python
python图像处理模块Pillow的学习详解
2019/10/09 Python
Python实现序列化及csv文件读取
2020/01/19 Python
Django 实现 Websocket 广播、点对点发送消息的代码
2020/06/03 Python
英国异国风情旅游网站:Travel Talk Tours(团体旅游、探险旅游、帆船假期)
2018/07/26 全球购物
欧洲著名的二手奢侈品网站:Vestiaire Collective
2020/03/07 全球购物
介绍一下Java的安全机制
2012/06/28 面试题
租赁协议书范本
2014/04/22 职场文书
员工年终自我评价
2014/09/14 职场文书
西安兵马俑导游词
2015/02/02 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
简单聊聊Vue中的计算属性和属性侦听
2021/10/05 Vue.js