jquery实现兼容IE8的异步上传文件


Posted in Javascript onJune 15, 2015

案例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script src="upload02.js"></script>
<script type="text/javascript">
 
  function look() {
    //alert($("form input[type=file]").val())
    alert($("input[name=test]").upload("getFileVal"))
  }
  function clean() {
    $("input[name=test]").upload("clean")
  }
  function ajaxSubmit() {
    $("input[name=test]").upload({
      url: 'index.aspx',
      // 其他表单数据
      params: { name: 'pxblog' },
      // 上传完成后, 返回json, text
      dataType: 'json',
      onSend: function (obj, str) { return true; },
      // 上传之后回调
      onComplate: function (data) {
        alert(data.file);
      }
    });
    $("input[name=test]").upload("ajaxSubmit")
  }
  function look1() {
    //alert($("form input[type=file]").val())
    alert($("input[name=test1]").upload("getFileVal"))
  }
  function clean1() {
    $("input[name=test1]").upload("clean")
  }
  function ajaxSubmit1() {
    $("input[name=test1]").upload({
      url: 'index.aspx',
      // 其他表单数据
      params: { name: 'pxblog' },
      // 上传完成后, 返回json, text
      dataType: 'json',
      onSend: function (obj, str) { return true; },
      // 上传之后回调
      onComplate: function (data) {
        alert(data.file);
      }
    });
    $("input[name=test1]").upload("ajaxSubmit")
  }
</script>
</head>
 
<body>
  <p>
<input type="button" value="look" onclick="look()" />
<input type="button" value="clean" onclick="clean()" />
<input type="button" value="ajaxSubmit" onclick="ajaxSubmit()" />
<input type="file" name="test" />
  </p>
  <p>
<input type="button" value="look1" onclick="look1()" />
<input type="button" value="clean1" onclick="clean1()" />
<input type="button" value="ajaxSubmit1" onclick="ajaxSubmit1()" />
<input type="file" name="test1" />
  </p>
</body>
</html>

源码:http://code.taobao.org/p/upload2/src/jquery.upload2.js

我测试的环境是IE10,在IE10的开发者工具中模拟IE8,测试通过。(我将浏览器的安全权限设置了中,应该没有多大关系)

修复了此人写的一些小错误,添加几个方法,主要是通过了IE8的测试(之前的不支持IE8)。

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
学习YUI.Ext 第二天
Mar 10 Javascript
javascript css styleFloat和cssFloat
Mar 15 Javascript
jquery 操作iframe的几种方法总结
Dec 13 Javascript
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
Jun 20 Javascript
React学习之事件绑定的几种方法对比
Sep 24 Javascript
JQuery选中select组件被选中的值方法
Mar 08 jQuery
JavaScript生成指定范围的时间列表
Mar 19 Javascript
jQuery超简单遮罩层实现方法示例
Sep 06 jQuery
Vant的安装和配合引入Vue.js项目里的方法步骤
Dec 05 Javascript
了解JavaScript函数中的默认参数
May 30 Javascript
基于vue-cli3创建libs库的实现方法
Dec 04 Javascript
JavaScript中document.activeELement焦点元素介绍
Nov 27 Javascript
JavaScript中使用Math.floor()方法对数字取整
Jun 15 #Javascript
jQuery实现自动调整字体大小的方法
Jun 15 #Javascript
JavaScript中使用指数方法Math.exp()的简介
Jun 15 #Javascript
Jquery简单实现GridView行高亮的方法
Jun 15 #Javascript
简介JavaScript中Math.cos()余弦方法的使用
Jun 15 #Javascript
JavaScript中的Math.atan2()方法使用详解
Jun 15 #Javascript
浅谈JavaScript中的Math.atan()方法的使用
Jun 14 #Javascript
You might like
php的hash算法介绍
2014/02/13 PHP
让codeigniter与swfupload整合的最佳解决方案
2014/06/12 PHP
PHP生成短网址的3种方法代码实例
2014/07/08 PHP
php实现多维数组中每个单元值(数字)翻倍的方法
2015/02/16 PHP
php中ob_flush函数和flush函数用法分析
2015/03/18 PHP
PHP生成指定随机字符串的简单实现方法
2015/04/01 PHP
php实现在多维数组中查找特定value的方法
2015/07/29 PHP
phpStorm+XDebug+chrome 配置详解
2019/04/01 PHP
javascript常用方法汇总
2014/12/02 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
2015/05/13 Javascript
JavaScript中数组继承的简单示例
2015/07/29 Javascript
Javascript HTML5 Canvas实现的一个画板
2020/04/12 Javascript
jQuery表单验证插件解析(推荐)
2016/07/21 Javascript
JS实现div模块的截图并下载功能
2017/10/17 Javascript
Vuex提升学习篇
2018/01/11 Javascript
vue项目中导入swiper插件的方法
2018/01/30 Javascript
JavaScript分步实现一个出生日期的正则表达式
2018/03/22 Javascript
Bootstrap fileinput 上传新文件移除时触发服务器同步删除的配置
2018/10/08 Javascript
js实现简单音乐播放器
2020/06/30 Javascript
解决vux 中popup 组件Mask 遮罩在最上层的问题
2020/11/03 Javascript
[03:32]2014DOTA2西雅图邀请赛 CIS外卡赛赛前black专访
2014/07/09 DOTA
[35:29]Secret vs VG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
用python实现的去除win下文本文件头部BOM的代码
2013/02/10 Python
Python中的集合类型知识讲解
2015/08/19 Python
Django基础三之视图函数的使用方法
2019/07/18 Python
Python udp网络程序实现发送、接收数据功能示例
2019/12/09 Python
css3 实现滚动条美化效果的实例代码
2021/01/06 HTML / CSS
html5 touch事件实现触屏页面上下滑动(二)
2016/03/10 HTML / CSS
倩碧美国官网:Clinique美国
2016/07/20 全球购物
工程造价与管理专业应届生求职信
2013/11/23 职场文书
工商企业管理实习自我鉴定
2013/12/04 职场文书
学校办公室主任职责
2013/12/27 职场文书
群众路线教育实践活动总结
2014/10/30 职场文书
2015年护士医德医风自我评价
2015/03/03 职场文书
导游词之山西关帝庙
2019/11/01 职场文书
PYTHON 使用 Pandas 删除某列指定值所在的行
2022/04/28 Python