<HTML>
<HEAD>
<META http-equiv='Content-Type' content='text/html; charset=gb2312'>
<TITLE>
</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
/**
* 类 名 称: DialogClass
* 功能说明: 禁止页面点击类
* 版权信息: CopyRight 2005-2006 JoeCom
* 创 建 人: JoeCom | MSN:juwuyi@hotmail.com | blog:http://hi.baidu.com/joecom
* 创建日期: 2006-07-21
* 修 改 人:
* 修改日期:
*/
function DialogClass(){
this.blankImgHandle = null;
this.tags = new Array("applet", "iframe", "select","object","embed");
this.body_overflow_y = null;
this.body_overflow_x = null;
this.hideAllSelect = function()
{
for( var k=0;k<this.tags.length;k++)
{
var selects = document.getElementsByTagName(this.tags[k]);
for (var i=0;i<selects.length;i++)
{
selects[i].setAttribute("oldStyleDisplay",selects[i].style.visibility);
selects[i].style.visibility = "hidden";
}
}
}
this.resetAllSelect = function()
{
for( var k=0;k<this.tags.length;k++)
{
var selects = document.getElementsByTagName(this.tags[k]);
for (var i=0;i<selects.length;i++)
{
if (selects[i].getAttribute("oldStyleDisplay")!=null)
selects[i].style.visibility = selects[i].getAttribute("oldStyleDisplay");
}
}
}
this.show = function()
{
this.body_overflow_y = document.body.style.overflowY;
this.body_overflow_x = document.body.style.overflowX;
document.body.style.overflowX = "hidden";
document.body.style.overflowY = "hidden";
this.hideAllSelect();
var w = "100%" ;
var h = "100%" ;
this.blankImgHandle = document.createElement("DIV");
with (this.blankImgHandle.style){
position = "absolute";
left = 0;
top = document.body.scrollTop;
height = "100%";
width = "100%";
zIndex = "9999";
filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)";
opacity = "0.6";
backgroundColor = "#ffffff";
}
document.body.appendChild(this.blankImgHandle);
}
this.close = function(){
document.body.style.overflowY = this.body_overflow_y;
document.body.style.overflowX = this.body_overflow_x;
if (this.blankImgHandle)
{
this.blankImgHandle.parentNode.removeChild(this.blankImgHandle);
}
this.resetAllSelect();
}
}
// End -->
</SCRIPT>
</HEAD>
<BODY >
<button onclick="demo()">DialogClass</button>
<script>
function demo()
{
var dialog = new DialogClass();
dialog.show(); //关闭:dialog.close();
}
</script>
</BODY></HTML>
原理:在整个页面铺一个width=100% ,height=100% 的div,并使z-index为很大的数,从而达到静止页面点击的功能。
转至:http://hi.baidu.com/joecom/blog/item/acb8cf1b1ac9f8faae513352.html
分享到:
相关推荐
这个"javascript经典特效---禁止刷新页面.rar"压缩包文件包含了一个示例,展示了如何使用JavaScript来阻止浏览器的刷新操作。 首先,我们需要理解浏览器的刷新事件。在HTML中,当用户点击浏览器的刷新按钮或者按下...
为了确保`dialog-polyfill`正常工作,你需要在`<head>`标签内引入`dialog-polyfill.css`,并在`<body>`标签结束前引入`dialog-polyfill.js`,以确保在DOM加载完毕后执行JavaScript代码: ```html <!DOCTYPE html> ...
`eslint-plugin-class-property`是一个专门为解决这个问题而设计的开源库,它是一个针对ESLint的插件,专注于处理类属性(class properties)的语法。本文将深入探讨这个插件的功能、用途以及如何在项目中集成和配置...
"class-inspector"就是这样一款专为前端开发者设计的开源库,它的主要功能是作为类检查器,帮助我们获取类的静态方法和实例方法,从而更好地理解和操作JavaScript对象。 一、什么是class-inspector "class-...
`parse-class`库的核心功能是将字符串形式的类列表转换为JavaScript对象,便于进一步操作。例如,给定一个字符串如`'foo bar baz'`,`parse-class`会将其解析为`{foo: true, bar: true, baz: true}`。这样,开发者...
在本文中,我们将深入探讨如何在`video.js`中实现“禁止进度条点击”的功能。 首先,我们需要了解`video.js`的基本结构。这个库通过HTML5 `<video>` 元素提供了一个强大的封装层,允许我们通过JavaScript进行高级...
13-dialog组件-涉及到的深度选择器知识大纲style添加属性scoped原理scoped会给当前组件的模板中所有的元素都添加一个随机的属性scoped会
在本项目中,我们主要探讨的是如何利用Node.js和Bootstrap框架来构建一个编辑修改学生信息的页面。Node.js是一款强大的JavaScript后端开发平台,而Bootstrap则是一个流行的前端UI框架,两者结合可以快速创建响应式、...
"js-class-is-master"这个压缩包很可能包含了"class-is"库的源码、示例、文档以及测试用例。源码通常分为几个部分:主文件(可能是`index.js`),可能包含库的核心逻辑;示例文件(如`examples`目录)用来演示如何在...
JavaScript应用实例-0根据图色点击.js
类变压器 它的ES6和Typescript时代。 如今,您比以往更多地使用类和构造函数对象。 类转换器允许您将普通对象转换为类的某些实例,反之亦然。 它还允许根据条件对对象进行序列化/反序列化。 这个工具在前端和后端都...
类验证器可在浏览器和node.js平台上使用。目录安装npm install class-validator --save注意:使用class-validator时,请至少使用npm @ 6。 从npm @ 6开始,依赖关系树被展平,这是class-validator要求的才能正常...
JavaScript应用实例-00-简化点击控件.js
在这个名为"class-of-builtins.rar_class"的压缩包里,包含的两个文件——10.1.5-1.js和class-of-builtins.js,很可能是关于JavaScript中的内置类以及自定义类的示例或教程。 1. **JavaScript 中的类(Class)** ...
JavaScript应用实例-钉钉打卡页面.js
文件夹部分: css--->层叠样式表文件 main.css--->index.html(也就是主页面的样式) reset.css--->覆盖浏览器默认的css样式 ... main.js---> 页面点击 视频显示的实现 media--->存放页面播放的视频
这个实例“javascript----一个Tab的JS”显然是关于如何使用JavaScript实现网页上的选项卡功能,这对于初学者来说是非常实用的实践项目。选项卡是网页设计中常见的组件,它能有效地组织和展示大量信息,提高用户体验...
首先,确保你的页面已经引入了jQuery库,因为jQuery是dialogBox.js的基础。然后,通过`<script>`标签引入`jquery.dialogBox.js`和相应的CSS样式文件。例如: ```html <script src="js/jquery.min.js"> ...
Nuxt类组件Nuxt.js的ES和Typescript类组件装饰器,扩展了安装npm install --save nuxt-class-component# oryarn add nuxt-class-component通天塔说明npm install --save-dev babel-plugin-transform-decorators-...
Visual Studio Code上搜不到插件Auto.js-Pro-Ext hyb1996