js 蒙版进度条(结合图片)


Posted in Javascript onMarch 10, 2010
/******************** 
** js 蒙版进度条(图片) 
** dingzh@jstrd.com 
** 2009-12-03 
*********************/ //禁止网页后退 
window.history.forward(1); 
document.attachEvent("onkeydown",docKeyDown); 
function docKeyDown() { 
//屏蔽退格删除键 
if (window.event.keyCode == 8) { 
if(window.event.srcElement.type != "text" 
&& window.event.srcElement.type != "textarea" 
&& window.event.srcElement.type != "password") { 
window.event.keyCode = 0x0; 
return false; 
} else if(window.event.srcElement.readOnly) { 
window.event.keyCode = 0x0; 
return false; 
} 
} 
} 

//加载进度条 
var process_submit_doing = false; 
try { 
window.attachEvent("onload",doBodyLoad); 
//document.attachEvent("onclick",doProcess); 
window.attachEvent("onbeforeunload",doWinLoad); 
} catch(e) { 
document.addEventListener("onclick",doProcess,false); 
window.addEventListener("onbeforeunload",doWinLoad,false); 
} 
// 
function doBodyLoad() { 
var obj; 
var vInput=document.getElementsByTagName("INPUT"); 
for(var i in vInput) { 
obj=vInput[i]; 
if(obj.type=="button" || obj.type=="submit") { 
obj.attachEvent("onclick",doProcess); 
} 
} 
vInput=document.getElementsByTagName("IMG"); 
for(var i in vInput) { 
obj=vInput[i]; 
if(undefined != obj.alt) { 
obj.attachEvent("onclick",doProcess); 
} 
} 
} 
// 
function doWinLoad() { 
process_submit_doing = true; 
} 
// 
function doProcess() { 
//是否正在提交 
if(!process_submit_doing) { 
return; 
} 
// 
var showProcess = false; 
//捕获事件源 
var eventObj = event.srcElement; 
var btnvalue = ""; 
if(eventObj.tagName=='INPUT') { 
btnvalue = eventObj.value; 
} else if(eventObj.tagName=='IMG') { 
if(null != eventObj.alt && "" != eventObj.alt) { 
btnvalue = eventObj.alt; 
} else { 
btnvalue = eventObj.title; 
} 
} 
btnvalue = btnvalue.replace(/ */g,"").replace(/ */g,""); 
// 
var my_array = new Array(); 
my_array.unshift("提交", "确定", "保存", "暂存", "结账", "审核", "审批", "作废", "回退", "退回", "驳回", 
"退单", "撤消", "导入", "受理", "办理", "处理", "查询", "入库", "入账", "出库", "出账"); 
for (i = 0; i < my_array.length; i++) { 
if(new RegExp(my_array[i],"ig").test(btnvalue)) { 
showProcess = true; 
break; 
} 
} 
//alert(showProcess); 
//不显示进度条 
if(!showProcess) { 
return; 
} 
// 
createProcessBgDiv(); 
} 

function nocontextmenu() 
{ 
event.cancelBubble = true 
event.returnValue = false; 
return false; 
} 
function norightclick() 
{ 
if (event.button == 2 || event.button == 3) 
{ 
event.cancelBubble = true 
event.returnValue = false; 
return false; 
} 
} 
//页面蒙版 
function createProcessBgDiv() 
{ 
var h=document.body.scrollHeight; 
var w=document.body.scrollWidth; 
var div=document.createElement("<div id='divProcessBg' style='position:absolute;visibility:visible;background:gray;filter:alpha(opacity=30);z-index:1000;left:0;top:0;width:"+w+"px;height:"+h+"px;'></div>"); 
//div.appendChild(document.createTextNode("xxxxxxxxxxxxxxxxxxxx")); 
div.appendChild(document.createElement("<iframe src='javascript:false' style='position:absolute; visibility:inherit; top:0px; left:0px; width:"+w+"px;height:"+h+"px; z-index:-1; filter=\"progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)\";'></iframe>")); 
document.body.appendChild(div); 
document.body.appendChild(document.createElement("<div style='position:absolute;z-index:1002;left:0;top:0;width:"+w+"px;height:"+h+"px;background:url(/upload/2010-3/20100310161010599.gif) no-repeat center center;'></div>")); 
//屏蔽鼠标右键 
document.oncontextmenu = nocontextmenu; // for IE5+ 
document.onmousedown = norightclick; // for all others 
} 
/*function delProcessBgDiv() 
{ 
document.body.removeChild(document.getElementById("divProcessBg")); 
document.onmousedown = null; 
} */
Javascript 相关文章推荐
JQuery Tips(2) 关于$()包装集你不知道的
Dec 14 Javascript
jQuery插件的写法分享
Jun 12 Javascript
Javascript核心读书有感之表达式和运算符
Feb 11 Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 Javascript
javascript实现数组内值索引随机化及创建随机数组的方法
Aug 10 Javascript
基于jquery编写的放大镜插件
Mar 23 Javascript
VUE中v-model和v-for指令详解
Jun 23 Javascript
js+SVG实现动态时钟效果
Jul 14 Javascript
详解关于html,css,js三者的加载顺序问题
Apr 10 Javascript
微信小程序点击保存图片到本机功能
Dec 13 Javascript
微信小程序实现自定义动画弹框/提示框的方法实例
Nov 06 Javascript
小程序组件传值和引入sass的方法(使用vant Weapp组件库)
Nov 24 Javascript
javascript 事件查询综合 推荐收藏
Mar 10 #Javascript
JQuery的html(data)方法与&amp;lt;script&amp;gt;脚本块的解决方法
Mar 09 #Javascript
Jquery替换已存在于element上的event的方法
Mar 09 #Javascript
JQery jstree 大数据量问题解决方法
Mar 09 #Javascript
Javascript Math ceil()、floor()、round()三个函数的区别
Mar 09 #Javascript
js 无提示关闭浏览器页面的代码
Mar 09 #Javascript
JS 无法通过W3C验证的处理方法
Mar 09 #Javascript
You might like
PHP中在数据库中保存Checkbox数据(2)
2006/10/09 PHP
php检查字符串中是否包含7位GSM字符的方法
2015/03/17 PHP
php操作MongoDB类实例
2015/06/17 PHP
PHP简单装饰器模式实现与用法示例
2017/06/22 PHP
PHP基于curl post实现发送url及相关中文乱码问题解决方法
2017/11/25 PHP
javascript html 静态页面传参数
2009/04/10 Javascript
Javascript 类型转换方法
2010/10/24 Javascript
详解Javascript 装载和执行
2014/11/17 Javascript
javascript制作的cookie封装及使用指南
2015/01/02 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
2015/04/12 Javascript
浅谈利用JavaScript进行的DDoS攻击原理与防御
2015/06/04 Javascript
Ajax清除浏览器js、css、图片缓存的方法
2015/08/06 Javascript
第一次动手实现bootstrap table分页效果
2016/09/22 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
2016/12/02 Javascript
jQuery阻止移动端遮罩层后页面滚动
2017/03/15 Javascript
认识jQuery的Promise的具体使用方法
2017/10/10 jQuery
Vue 实现列表动态添加和删除的两种方法小结
2018/09/07 Javascript
详解angular2.x创建项目入门指令
2018/10/11 Javascript
vue实现侧边栏导航效果
2019/10/21 Javascript
你不知道的SpringBoot与Vue部署解决方案
2020/11/09 Javascript
[00:58]2016年国际邀请赛勇士令状宣传片
2016/06/01 DOTA
[01:19:23]2018DOTA2亚洲邀请赛 4.5 淘汰赛 Mineski vs VG 第二场
2018/04/06 DOTA
[43:36]Liquid vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
PyCharm 常用快捷键和设置方法
2017/12/20 Python
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
对python:循环定义多个变量的实例详解
2019/01/20 Python
python代理工具mitmproxy使用指南
2019/07/04 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
python实现交并比IOU教程
2020/04/16 Python
详解css position 5种不同的值的用法
2019/07/30 HTML / CSS
h5页面背景图很长要有滚动条滑动效果的实现
2021/01/27 HTML / CSS
党支部先进事迹材料
2014/12/24 职场文书
党支部季度考核意见
2015/06/02 职场文书
千与千寻观后感
2015/06/04 职场文书
法定代表人资格证明书
2015/06/18 职场文书
教学工作总结范文5篇
2019/08/19 职场文书