<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中,当用户点击浏览器的刷新按钮或者按下...
首先,你需要在页面中引入 jQuery 和 jQuery UI 的 CSS 与 JS 文件。jQuery UI 包含了 Dialog 插件的实现: ```html <!-- 引入 jQuery --> <script src="https://code.jquery.com/jquery-3.x.y.min.js"> <!-- 引入 ...
在APICloud中,DialogBox是对原生对话框功能的封装,通过JavaScript API调用,能够实现与原生应用一样的对话框效果。这包括警告对话框、确认对话框、输入对话框等多种类型,满足开发者在不同场景下的需求。 1. **...
为了确保`dialog-polyfill`正常工作,你需要在`<head>`标签内引入`dialog-polyfill.css`,并在`<body>`标签结束前引入`dialog-polyfill.js`,以确保在DOM加载完毕后执行JavaScript代码: ```html <!DOCTYPE html> ...
Bootstrap的Dialog.js是一个基于Bootstrap框架的对话框插件,它扩展了Bootstrap的模态(Modal)组件,提供了更丰富的交互性和自定义功能。在网页应用中,对话框常常用于显示警告、确认信息或者进行表单操作,...
"class-inspector"就是这样一款专为前端开发者设计的开源库,它的主要功能是作为类检查器,帮助我们获取类的静态方法和实例方法,从而更好地理解和操作JavaScript对象。 一、什么是class-inspector "class-...
类变压器验证器 一个简单的用于和插件,将它们组合成一个美观且对程序员友好的API。安装模块安装npm install class-transformer-validator --save (或简称): npm i -S class-transformer-validator 对等依赖这个...
首先,确保你的页面已经引入了jQuery库,因为jQuery是dialogBox.js的基础。然后,通过`<script>`标签引入`jquery.dialogBox.js`和相应的CSS样式文件。例如: ```html <script src="js/jquery.min.js"> ...
13-dialog组件-涉及到的深度选择器知识大纲style添加属性scoped原理scoped会给当前组件的模板中所有的元素都添加一个随机的属性scoped会
"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要求的才能正常...
2. **模态与非模态**:ArtDialog支持创建模态对话框(阻止用户与页面其他部分交互)和非模态对话框,适用于不同类型的提示和信息展示。 3. **响应式设计**:随着移动设备的普及,响应式设计变得至关重要。ArtDialog...
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--->存放页面播放的视频
综上所述,"java转js工具"是一个重要的开发辅助工具,它帮助开发者在Java和JavaScript之间架起桥梁,使得跨平台开发变得更加便捷。然而,使用时需要注意语言特性的差异,以及转换过程中可能出现的问题和挑战。
JavaScript应用实例-WebView多页面浏览.js