<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
.spa{
font-size:12px;
color:#0066ff;
}
.put{
font-size:12px;
font-family:Arial;
color:#0066ff;
background-color:#fef4d9;
padding:0px;
border-style:none;
}
.put2{
font-size:12px;
color:#0066ff;
text-align:center;
border-width:medium;
border-style:none;
}
</style>
</HEAD>
<BODY>
<div id="up">
<span class="spa">载入中,请稍等...</span>
<input id="chart" type="text" size="54" class="put" readOnly />
<input id="percent" type="text" size="20" class="put2" readOnly />
</div>
<div id="ff">
<form name="upload" method="post" action="">
<input type="file" id="f" size="30" />
<input type="button" id="b" value="上传" onclick="count()"/>
</form>
</div>
<script language="javascript">
var bar=0;
var line="||";
var amount="";
document.getElementById("up").style.display="none";
function count(){
var f = document.getElementById("f");
var b = document.getElementById("b");
b.disabled = true;
f.disabled = true;
if(f.value==""){
b.disabled = false;
f.disabled = false;
alert("请添加上传文件");
return false;
}
document.getElementById("up").style.display="inline";
bar = bar+2;
amount = amount+line;
document.getElementById("chart").value=amount;
document.getElementById("percent").value=bar+"%";
if(bar<99){
setTimeout("count()",200);
}else{
b.disabled = false;
f.disabled = false;
alert("加载完毕！");
document.getElementById("up").style.display="none";
// window.location="";
}
}
</script>
</BODY>
</HTML>
分享到：
相关推荐
一款不错的jQuery动态进度条插件的示例及下载，可设定走动速度，限定时间的动态进度条效果，放在网页上也是很漂亮的效果，演示页面一共演示了三种速度的进度条，进度速度可以自己调节，旁边可显示网络速度，用在上传...
在web应用中，客户端向服务器传送大文件是常用功能。在上传过程中，不给用户提供当前上传进度...本文中包含的知识点包括：进度条的实现、本地文件读取到字节数组、ajax等。这些知识点都可以在容百川上传的资料中得到。
Javascript上传进度条
总结的一个javascript实现的上传文件进度条
使用css3来实现环形进度条，只传入百分比中的数字即可展示环形状态，可以根据具体需求进行代码修改。写在最后的：csdn不支持上传资源的编辑只能再上传一遍有sass代码的文件。。
无刷新实现上传文件时的进度条. 调用upfile函数。任务执行完后调用changekey函数。更改背景调用_syspro。
php与js进行结合实现文件上传时进度条的操作
修改ajaxfileupload.js 文件，实现ajaxfileupload文件上传进度条
js,h5，简单使用,实现进度条上传
本文实例介绍了js结合HTML5 Ajax实现文件上传进度条功能，分享给大家供大家参考，具体内容如下 1. lib.js var Host = [removed].host; //--Cookie function setCookie(name,value) { var Days = 30; var exp =...
主要介绍了Vue实现带进度条的文件拖动上传功能,本文通过实例代码给大家介绍的非常详细，具有参考借鉴价值，需要的朋友可以参考下
springboot开发服务后台，提供文件上传接口，vue.js搭建前端项目，mint-ui做为UI界面，axios与后端服务接口交互，axios可实时监控文件上传进度，通过mint-ui实时展示当前文件上传进度
很实用的文件上传，带进度条，上传效果非常好；可以实现批量上传。
使用ASP方式实现javascript文件上传进度条
主要为大家详细介绍了js实现带进度条提示的多视频上传功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
采用Prototype.js实现的Ajax模式文件上传进度条，代码简单明了
主要为大家详细介绍了node.js实现携带进度条的多文件上传，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
php+js使用XMLHttpRequest通过js模拟表单提交上传视频同时实现进度条展示，上传后自动加载并播放功能。
主要介绍了PHP中使用Session配合Javascript实现文件上传进度条功能,本文讲解了实现原理,并给出了完整实现代码,需要的朋友可以参考下