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 相关文章推荐
来自qq的javascript面试题
Jul 24 Javascript
JavaScript游戏之是男人就下100层代码打包
Nov 08 Javascript
php图像生成函数之间的区别分析
Dec 06 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
Apr 06 Javascript
javascript中setTimeout的问题解决方法
May 08 Javascript
jQuery实现锚点scoll效果实例分析
Mar 10 Javascript
js+css实现超简洁的二级下拉菜单效果代码
Sep 07 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
Oct 20 Javascript
AngularJS实现动态编译添加到dom中的方法
Nov 04 Javascript
Vue.set 全局操作简单示例
Sep 19 Javascript
js判断在哪个浏览器打开项目的方法
Jan 21 Javascript
JS中类的静态方法,静态变量,实例方法,实例变量区别与用法实例分析
Mar 14 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的十大要点(上)
2009/02/04 PHP
php中防止SQL注入的最佳解决方法
2013/04/25 PHP
PHP获取一年中每个星期的开始和结束日期的方法
2015/02/12 PHP
PHP微信支付开发实例
2016/06/22 PHP
php版微信支付api.mch.weixin.qq.com域名解析慢原因与解决方法
2016/10/12 PHP
Laravel中9个不经常用的小技巧汇总
2019/04/16 PHP
两个比较有用的Javascript工具函数代码
2010/02/17 Javascript
jQuery(1.6.3) 中css方法对浮动的实现缺陷分析
2011/09/09 Javascript
jquery 模板的应用示例
2013/11/12 Javascript
jquery.form.js用法之清空form的方法
2014/03/07 Javascript
js简单的点击返回顶部效果实现方法
2015/04/10 Javascript
javascript操作ul中li的方法
2015/05/14 Javascript
浅谈javascript事件取消和阻止冒泡
2015/05/26 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
2015/12/08 Javascript
JS DOM实现鼠标滑动图片效果
2020/09/17 Javascript
详解JavaScript 中getElementsByName在IE中的注意事项
2017/02/21 Javascript
JS字符串按逗号和回车分隔的方法
2017/04/25 Javascript
AngularJS实现动态添加Option的方法
2017/05/17 Javascript
python类定义的讲解
2013/11/01 Python
python基础教程之类class定义使用方法
2014/02/20 Python
Python读写Redis数据库操作示例
2014/03/18 Python
Python绑定方法与非绑定方法详解
2017/08/18 Python
JavaScript中的模拟事件和自定义事件实例分析
2018/07/27 Python
python3.6+django2.0+mysql搭建网站过程详解
2019/07/24 Python
python实现拉普拉斯特征图降维示例
2019/11/25 Python
Python加密模块的hashlib,hmac模块使用解析
2020/01/02 Python
tensorflow如何继续训练之前保存的模型实例
2020/01/21 Python
CSS3五个技巧给你的网站带来出色的效果
2009/04/02 HTML / CSS
一款纯css3实现的圆形旋转分享按钮旋转角度可自己调整
2014/09/02 HTML / CSS
创立科技Java面试题
2015/11/29 面试题
大四毕业生学习总结的自我评价
2013/10/31 职场文书
中秋节超市促销方案
2014/01/30 职场文书
中式婚礼主持词
2014/03/13 职场文书
领导干部“四风”问题批评与自我批评材料
2014/09/24 职场文书
2015年大学班长个人工作总结
2015/04/24 职场文书
用Python提取PDF表格的方法
2021/04/11 Python