jquery异步上传文件,支持IE8

http://code.taobao.org/p/upload2/src/ 已经托管至淘宝code

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

案例:

<!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>

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

源码修改自:http://www.ponxu.com。

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

时间: 2024-10-15 08:35:18

jquery异步上传文件,支持IE8的相关文章

【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)

前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现ajaxFileUpload这个插件挺不错,所以就用这个插件来做异步上传文件的效果.网上也有很多对ajaxFileUpload插件的使用的文章,不过我发现没有PHP版,所以这次服务器那边的处理就使用PHP语言来处理. 一.先对ajaxFileUpload插件的语法参数进行讲解 原理:ajaxfileu

JQuery插件ajaxFileUpload 异步上传文件(PHP版)

太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现ajaxFileUpload这个插件挺不错,所以就用这个插件来做异步上传文件的效果.网上也有很多对ajaxFileUpload插件的使用的文章,不过我发现没有PHP版,所以这次服务器那边的处理就使用PHP语言来处理. 一.

jQuery插件-ajaxFileUpload异步上传文件

ajaxFileUpload是前两天学习过程中接触到的一个JQ插件,功能很简单,就是实现异步上传文件的功能. 1.语法介绍 $.ajaxFileUpload([setting]); 参数说明: (1)url——执行上传处理的地址: (2)secureuri——是否启用安全提交,默认为false: (3)fileElementId——需要上传<input type=”file”>控件id属性值: (4)data——自定义参数,即需要额外传递的JSON格式数据: (5)type——请求方式,提交自

struts2 jquery ajaxFileUpload 异步上传文件

一.ajaxFileUpload 实现异步上传文件利用到了ajaxFileUpload.js这个文件,这是别人开发的一个jquery的插件,可以实现文件的上传并能够和struts2框架和好的融合在一起.但是网上的提供的一些ajaxFileUpload.js插件存在一些问题,不能够实现多次点击上传文件,要想再次上传必须重新刷新页面.在网上找了好久才找到真正的解决方案,有些网友给出的解决方案并没有真正的解决问题,不知到什么原因.我的修改: 原文件: var oldElement = $('#' +

HTML5 jQuery+FormData 异步上传文件,带进度条

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link href="../resources/css/common.css" rel="stylesheet" /> <script src="../resources/js/jquery-2.1.4.js"></script> <

MVC文件上传 - 使用jquery异步上传并客户端验证类型和大小

本篇体验MVC上传文件,从表单上传过渡到jquery异步上传. MVC最基本的上传文件是通过form表单提交方式 □ 前台视图部分 <% using(Html.BeginForm("FileUpload", "FileUpload", FormMethod.Post, new {enctype = "multipart/form-data"}) {)%> <input name ="uploadFile" t

Asp.Net Mvc异步上传文件的方式

今天试了下mvc自带的ajax,发现上传文件时后端action接收不到文件, Request.Files和HttpPostedFileBase都接收不到.....后来搜索了下才知道mvc自带的Ajax不支持文件上传,无奈之下只能用其他的方式 第一种方式:通过 jquery的ajaxSubmit --->(先引入jQuery脚本)需要引入jquery.form.min.js(可以通过NuGet下载) 直接上代码 @{ Layout = null; } <!DOCTYPE html> <

简述三种异步上传文件方式

 很久没写过博客了! 上次写已经是去年的12月了,离现在也有足足三个月了.这几个月因为要搭建个人网站以及准备个人简历,包括最近要准备最近的各大公司的实习春招,很难抽时间来写博客,这次的异步文件上传我觉得是很有必要了解的,笼络了很多知识点,因此准备写一篇博客来巩固下. 异步上传文件是为了更好的用户体验,是每个前端必须掌握的技能.这里我提出三点有关异步文件上传的方式. 使用第三方控件,如Flash,ActiveX等浏览器插件上传. 使用隐藏的iframe模拟异步上传. 使用XMLHttpReques

异步上传文件多种方式归纳

最近在做异步上传文件的工作,用到了一些库,这里归纳下,暂且不考虑异常处理,仅作为demo. 1.不用任何插件,利用iframe,将form的taget设为iframe的name,注意设为iframe的id是没用的,跟网上很多说的不太一致 iframe_upload.htm <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm