进度条(页面刷新)【原创】
<HTML><HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<META HTTP-EQUIV="REFRESH" CONTENT="1200"> //meta 标签: 每1200秒刷新一次页面
<title></title>
<style type="text/css">
<!--
body {
margin-top: -6px;
margin-left: 0px;
}
-->
</style>
<link href="css/styles.css" rel="stylesheet" type="text/css">
<script>
function xyProgressLG(xyID){
this.xyProgressID = 'oProgress' + Math.random().toString().substr(2, 10) + xyID;
this.max = 0;
this.min = 0;
this.value = 10;
this.width = 100;
this.height = 20;
this.currPos = 0;
this.outerBorderColor = "black";
this.outerBackColor = "white";
this.innerBorderColor = "";
this.innerBackColor = "blue";
this.TextColor = "red";
this.SetProgressTop = xySetProgressTop;
this.SetProgressLeft = xySetProgressLeft;
this.SetProgressWidth = xySetProgressWidth;
this.SetProgressHeight = xySetProgressHeight;
this.SetProgressMax = xySetProgressMax;
this.SetProgressMin = xySetProgressMin;
this.UpdateToPersent = xyUpdateToPersent;
xyProgressInit(this.xyProgressID);
return this.xyProgressID;
}
function xyProgressInit(xyID){
var div = document.createElement("div");
div.id = xyID;
div.style.position = "absolute";
div.style.left = "100px";
div.style.top = "100px";
document.body.appendChild(div);
var pro = document.createElement("div");
pro.style.position = "absolute";
pro.style.left = "0px";
pro.style.top = "0px";
pro.style.fontSize= "0px";
pro.style.width = "100px";
pro.style.height = "20px";
pro.style.border = "1px solid black";
pro.style.background = "white";
pro.style.zIndex = "100";
div.appendChild(pro);
var proInner = document.createElement("div");
proInner.id = xyID+"_Inner";
proInner.style.position = "absolute";
proInner.style.left = "1px";
proInner.style.top = "1px";
proInner.style.fontSize= "0px";
proInner.style.width = "0px";
proInner.style.height = "16px";
proInner.style.border = "1px solid black";
proInner.style.background = "blue";
pro.style.zIndex = "102";
pro.appendChild(proInner);
var text = document.createElement("div");
text.style.position = "absolute";
text.style.left = "50px";
text.style.top = "2px";
text.style.fontSize= "11px";
text.style.width = "40px";
text.style.height = "16px";
text.style.zIndex = "103";
div.appendChild(text);
}
function xySetProgressTop(pStyleTop){
try{
var e = document.all(this.xyProgressID);
e.style.top = pStyleTop;
}catch(e){
alert(e.description);
}
}
function xySetProgressLeft(pStyleLeft){
try{
var e = document.all(this.xyProgressID);
e.style.left = pStyleLeft;
}catch(e){
alert(e.description);
}
}
function xySetProgressWidth(pWidth){
try{
var e = document.all(this.xyProgressID);
e.style.width = pWidth;
eOuter = e.children(0);
eOuter.style.width = pWidth;
this.width = pWidth;
}catch(e){
alert(e.description);
}
}
function xySetProgressHeight(pHeight){
try{
var e = document.all(this.xyProgressID);
e.style.height = pHeight;
eOuter = e.children(0);
eInner = e.children(0).children(0);
eOuter.style.height = pHeight;
eInner.style.height = pHeight-4;
this.height = pHeight;
}catch(e){
alert(e.description);
}
}
function xySetProgressMax(pMax){
this.max = pMax;
}
function xySetProgressMin(pMin){
this.min = pMin;
}
function xyUpdateToPersent(pPersent){
try{
var e = document.all(this.xyProgressID);
e = e.children(0).children(0);
var len = this.width;
var pos = len*pPersent/100;
if(pos>this.width||pos<0){
return -1;
}
e.style.width = pos;
this.currPos = pos;
return this.currPos;
}catch(e){
alert(e.description);
return -1;
}
}
function onload()
{
var len = document.form1.display.value;
if(len>=0 && len<100)
{
setTimeout("document.location.reload()",2000); //每2秒重新加载页面,也即刷新。
}
else
{
return;
}
}
function update(){
var len = document.form1.display.value; //取name=display的域的value值
if(len >= 100)
{
len =100;
document.all["dis"].innerHTML = "Upgrade Completed! The Phone Will be Reboot!"; //填充id=dis的域
}
if(len < 0)
{
document.all["dis"].innerHTML = "Upgrade Error!";
return;
}
xy.UpdateToPersent(len)
onload();
//document.all["dis"].innerHTML = len+"%";
//setTimeout("update()",2000);
//setTimeout("document.location.reload()",2000); //计时器,每两秒调用一次reload()函数。
}
</script>
</HEAD>
<body onLoad="update()">
<script>
var xy = new xyProgressLG("zjf"); //初始化
xy.SetProgressLeft(200)
xy.SetProgressTop(290);
xy.SetProgressWidth(200)
xy.SetProgressHeight(20)
xy.SetProgressMax(200)
xy.SetProgressMin(50);
</script>
<table width="650" height="304" border="0" cellpadding="0" cellspacing="2" class="biankuang">
<tr>
<td height="300" valign="top"><form name="form1" method="post" enctype="multipart/form-data" action="goform/http_upload_firmware" >
<table width="650" height="21" cellspacing="0">
<tr bgcolor="#A6CE39">
<td width="100" bgcolor="#A6CE39"><span class="style1"> </span><span class="biaoti">Home</span></td>
<td width="200"><span class="biaoti">• System Setting </span></td>
<td width="350"><span class="biaoti">• Update Firmware</span></td>
</tr>
</table>
<table width="650" height="26" cellspacing="0" class="unnamed1">
<tr>
<td valign="middle"><span class="style2"> </span><span class="hongsezi">Update Firmware</span></td>
</tr>
</table>
<table width="650" height="40" cellspacing="0">
<tr><td colspan="2" valign="middle"><b class="biaoti2">
This page allows you upgrade the firmware to new version. Please note,
do not power off the device during the update because it may crash the system!
</b></td>
</tr></table>
<table width="650" cellspacing="0">
<tr>
<td bgcolor="#CCCCCC"><em><strong> </strong></em>Through This Web Page </td>
</tr>
</table>
<br>
<table width="650" height="121" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="121" colspan="3" align="center" class="other"><p>The phone is upgrading...<br>
Please DON'T power off!<br>
After finished,the phone will reboot by itself </p>
</td>
</tr>
</table>
<table>
<tr>
<td width="405"> </td>
</tr>
<tr>
<td id = "dis" width="650" align="center"> </td>
</tr>
</table>
<table>
<tr>
<td width="405"> </td>
<td width="50" align="left"><input name="display" type="text" style="border: none" value="<% progress(); %>" readonly> </td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</BODY>
</HTML>
进度条(页面刷新)【原创】相关推荐
- Java文件下载,HTML进度条实时刷新进度
效果展示 实现原理 1:后台同步进程开始下载文件 2:前台使用遮罩效果,使页面不能点击,使用circliful进度条插件(插件源码见后) 3:页面使用JavaScript定时器发送ajax请求刷新进度 ...
- java 进度条 不更新_java 进度条不能刷新解决方案 (已更新一次)
java期末考试都考完了,实验课却还没完,课程设计也还没开始做,本来打算把最后两次实验尽快做完,然后好好做课设,(我早就想写的坦克大战,过几天写好了,也肯定要整理发布出来).可却被多线程一题给坑了,题 ...
- 用 Python 写出这样的进度条,刷新了我对进度条的认知
❞ 1 简介 在日常运行程序的过程中常常涉及到「循环迭代」过程,对于执行时间很短的程序来说倒无所谓,但对于运行过程有明显耗时的涉及「循环迭代」的程序,为其加上「进度条」(progress bar),是 ...
- 【vue页面数据请求进度条--页面爱心--借助插件实现页面防抖-echarts实现自适应】
1.页面爱心 点击出现随机颜色小爱心 它是一个js文件实现的 我们首先创建一个love.js文件,然后把下面代码拿过去并导出 export function love() {;(function (w ...
- vlc 播放器的播放进度条的时间不刷新
有些视频如(rmvb)视频在使用vlc播放器播放时会出现进度条不能刷新的问题, 通过Java层代码找到刷新进度条的接口.是通过public native long getLength()(MediaP ...
- centos 6.5 启动时卡在进度条位置无法进入系统解决办法。
今天公司服务器因突然断电导致phddns 花生壳 启动失败,一直卡在启动进度条页面. 解决办法 1.按F5查看卡在什么位置, 2.查看解决方法:程序卡住的情况下,直接备份资料后,卸载程序重启就可以了. ...
- Visual C++利用互斥量同步线程实现文件读取进度条
忘了原文的位置了. 一.前言 文件读取进度条的实现可以有很多种方法,常用的是在读取文件的过程中隔一定时间向对话框发送消息以控制进度条的位置,但是这种方法很难确定隔多少时问发送一个消息,因为文件的大小是 ...
- layui进度条:调用、参数设置、动态渲染、数据热更新 (含案例、代码)
文章目录 layui进度条:调用.参数设置.动态渲染.数据热更新 (含案例.代码) 一.demo案例 1.1. 应用 · 截图: 1.2. 案例 · 全部代码: 二.自定义案例 2.1. 部分代码: ...
- springboot:实现文件上传下载实时进度条功能【附带源码】
0. 引言 记得刚入行的时候,做了一个文件上传的功能,因为上传时间较久,为了用户友好性,想要添加一个实时进度条,显示进度.奈何当时技术有限,查了许久也没用找到解决方案,最后不了了之. 近来偶然想到这个 ...
- 安卓移动开发——用AsyncTask来实现计时器和进度条
运行前 运行后 布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" ...
最新文章
- #讲座#低碳经济0814
- mysql改国标码_MySQL 优化实施方案
- 分布式技术一周技术动态 2016.07.10
- leetcode 383 赎金信 C++
- 源码详解Java的反射机制
- stata 倾向得分匹配(二)偏差校正匹配估计量
- python latex显示不出来_10 个加速Python数据分析的简单的小技巧
- 用Vue-cli3+element+mockjs 实现后台管理权限系统及顶栏三级菜单显示
- 图解 ElasticSearch 原理,写得太好了!
- Ubuntu下自制douban.fm播放器
- C语言实验—— 数值统计
- 2008年南京等5城市将升格直辖市
- 多域名一个公网ip多内网应用服务同时使用80端口
- azw3文件怎么打开?
- 三数之和java实现ArrayList-leetcode算法编程-探索字节跳动面试
- 详细理解JS的三座大山
- Rate Limiting速率限制
- 处理eclipse项目左下角有个红叉的问题
- 重新安装macOS 一直报no bag entry
- Mybatis错误 Result Maps collection already contains value for xxx
热门文章
- java调用一个外部url_Spring Boot :访问外部接口
- git lfs mac 安装_mac安装homebrew
- 计算机专业考试知识点,2016计算机专业知识:精选知识点练习(126)
- c++ 字符串拼接_源码上看 .NET 中 StringBuilder 拼接字符串的实现
- 推荐:腾讯开源的词向量精简版本下载|湾区人工智能
- 阿里云镜像下载ubuntu 1
- 北京市通信管理局对3·15晚会曝光的北京企业作出行政处罚
- 特斯拉回应Model 3新车无USB接口:芯片短缺
- 安卓阵营最强Soc!骁龙898即将亮相:小米12系列本月底前后首发
- 发力金融市场,中兴通讯有何硬实力?