利用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 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 jQuery
jQuery中过滤器的基本用法示例
Oct 11 jQuery
js与jQuery实现的用户注册协议倒计时功能实例【三种方法】
Nov 09 jQuery
如何快速解决JS或Jquery ajax异步跨域的问题
Jan 08 jQuery
jQuery实现动态显示select下拉列表数据的方法
Feb 05 jQuery
JS文件中加载jquery.js的实例代码
May 05 jQuery
jQuery事件委托代码实践详解
Jun 21 jQuery
jQuery实现轮播图效果
Nov 26 jQuery
jquery检测上传文件大小示例
Apr 26 jQuery
jquery绑定事件 bind和on的用法与区别分析
May 22 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 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
php中几种常见安全设置详解
2010/04/06 PHP
手把手教你打印出PDF(关于fpdf的简单应用)
2013/06/25 PHP
php保存二进制原始数据为图片的程序代码
2014/10/14 PHP
php魔法函数与魔法常量使用介绍
2017/07/23 PHP
浅谈PHPANALYSIS提取关键字
2019/03/08 PHP
jQuery制作的别致导航有阴影背景高亮模式窗口
2014/04/15 Javascript
JavaScript函数获取事件源的小例子
2014/05/14 Javascript
js获取网页可见区域、正文以及屏幕分辨率的高度
2014/05/15 Javascript
JavaScript前端图片加载管理器imagepool使用详解
2014/12/29 Javascript
JavaScript将XML转成JSON的方法
2015/03/12 Javascript
jQuery实现跨域iframe接口方法调用
2015/03/14 Javascript
javascript实现禁止鼠标滚轮事件
2015/07/24 Javascript
jquery.cookie实现的客户端购物车操作实例
2015/12/24 Javascript
JavaScript的设计模式经典之代理模式
2016/02/24 Javascript
js实现图片360度旋转
2017/01/22 Javascript
jquery获取下拉框中的循环值
2017/02/08 Javascript
详解webpack打包vue时提取css
2017/05/26 Javascript
Vue实现点击后文字变色切换方法
2018/02/11 Javascript
vue实现一个6个输入框的验证码输入组件功能的实例代码
2020/06/29 Javascript
Python实现数通设备端口使用情况监控实例
2015/07/15 Python
python实现数据写入excel表格
2018/03/25 Python
python爬虫实例详解
2018/06/19 Python
Python 获取中文字拼音首个字母的方法
2018/11/28 Python
python之pyqt5通过按钮改变Label的背景颜色方法
2019/06/13 Python
屏蔽Django admin界面添加按钮的操作
2020/03/11 Python
Python Socketserver实现FTP文件上传下载代码实例
2020/03/27 Python
Soft Cotton捷克:来自爱琴海棉花的浴袍
2017/02/01 全球购物
加拿大高尔夫超市:Golf Town
2018/01/12 全球购物
美国排名第一的泳池用品直接来源:In The Swim
2019/09/23 全球购物
Unix如何在一行中运行多个命令
2015/05/29 面试题
制药工程专业毕业生推荐信
2013/12/24 职场文书
楼面部长岗位职责范本
2014/02/14 职场文书
《那片绿绿的爬山虎》教学反思
2014/02/27 职场文书
给原生html中添加水印遮罩层的实现示例
2021/04/02 Javascript
MySQL中distinct和count(*)的使用方法比较
2021/05/26 MySQL