实例介绍
【实例简介】本上传程序实现了多文件上传，不限制文件数量，不限制文件类型，单个文件不超过2G，上传过程当中始终有动态图标转动及文字提示，
所有文件上传完时会有 “上传成功” 提示，动态图标及提示消失，本程序为.Net WebForm程序，用.NET Framework 4.5框架，
真正的异步上传，也提高了上传速度。程序基本少许改动，也可用于MVC NetCore等程序。
程序兼容IE8,9,10,11, 360浏览器 谷歌浏览器，主要解决了IE8下<input type="file" id="vpath" multiple="multiple"/>
属性multiple ="multiple"无效，IE8下不能多选文件的问题。增加多个上传文件输入框时，要按顺序选择文件，例如页面上有3
个文件输入框，要传2个文件，那么请在第1个，第2个文件框里选择上传文件。不然程序会报上传失败，有部分文件不能成功上传。
IE8以上的浏览器做起来不用这么麻烦，文件输入框加入multiple="multiple"这个属性即可一个输入框选择多个文件，有奇葩客户
非要求兼容IE8(老掉牙了)，也只好做这么个上传。
【实例截图】
上传成功的文件保存再 QygUploadFile\ZWFile 文件夹下
【核心代码】
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="QygUploadFile.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>多文件上传</title>
<script type="text/javascript" src="Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="layer/layer.js"></script>
<script type="text/javascript" src="Scripts/ajaxfileupload.js"></script>
<script type="text/javascript">
var i = 1;
function addFile() {
var str = '<div>'
'<input type="file" id="fileUpload' i '" name="fileUpload" style="width:400px"/>'
'</div><br />';
document.getElementById('MyFile').insertAdjacentHTML("beforeEnd", str);
i ;
}
var loadingIndex = null;
var flag = 0;
var str = "";
function loadingStart() {
try {
loadingIndex = layer.load(1, { //icon支持传入0-2
shade: [0.1, 'gray'], //0.5透明度的灰色背景
content: '正在上传文件，请勿关闭此页面，请耐心等待...',
success: function (layero) {
layero.find('.layui-layer-content').css({
'padding-top': '39px',
'width': '400px'
});
}
});
var list = document.getElementsByName("fileUpload");
var list1 = 0;
for (var i = 0; i < list.length; i ) {
if ($("#fileUpload" i)[0].value != "") {
list1 ;
}
}
var b = list1;
var d = 1;
for (var a = 0; a < b; a ) {
var c = 'fileUpload' a;
$.ajaxFileUpload({
type: "post",
data:{invalue:a},
secureuri: false, //是否需要安全协议，一般设置为false
fileElementId: c, //文件上传域的ID
url: 'UploadFile.ashx',
dataType: 'json', //返回值类型 一般设置为json
async: true,
success: function (data, status) //服务器成功响应处理函数
{
if (b == d) {
alert("上传成功");
layer.close(loadingIndex);
}
d ;
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert("上传失败");
}
});
}
}
catch (e) {
}
}
</script>
</head>
<body>
<div>
<div>
<input onclick="addFile()" type="button" value="增加文件(Add)" /><br /><br />
</div>
<div id="MyFile">
<input type="file" id="fileUpload0" name="fileUpload" style="width:400px"/><br /><br />
</div><br />
<input id="Button1" type="button" value="button" onclick="loadingStart()" />
</div>
</body>
</html>
好例子网口号：伸出你的我的手 — 分享！
小贴士
感谢您为本站写下的评论，您的评论对其它用户来说具有重要的参考价值，所以请认真填写。
- 类似“顶”、“沙发”之类没有营养的文字，对勤劳贡献的楼主来说是令人沮丧的反馈信息。
- 相信您也不想看到一排文字/表情墙，所以请不要反馈意义不大的重复字符，也请尽量不要纯表情的回复。
- 提问之前请再仔细看一遍楼主的说明，或许是您遗漏了。
- 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦，又没人会搭理，于人于己都无利。
关于好例子网
本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享，对搜索内容的合法性不具有预见性、识别性、控制性，仅供学习研究，请务必在下载后24小时内给予删除，不得用于其他任何用途，否则后果自负。基于互联网的特殊性，平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查；无论平台是否已进行审查，用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定，若资源存在侵权或相关问题请联系本站客服人员，点此联系我们。关于更多版权及免责申明参见 版权及免责申明
网友评论
我要评论