方法1

<SCRIPT language="javascript">
<!--
function lock(menu)       //锁定函数
{menu.style.display="none"?'':''; //打开蒙版
document.cookie="lock=yes";   //设置cookies,使锁定长期有效,
lockpwd.focus();        //密码框直接获取焦点
}

function unlock(menu)      //解锁函数
{
menu.style.display=""?'none':'none'; //去除蒙版,达到解锁
document.cookie="lock=no";    //设置cookie
return false;
}

function cklock()         //对输入的密码进行验证
{  
if (lockpwd.value==getcookie('lockpwd')) //验证密码与cookie密码
{ unlock(lockform);}
else
{alert("密码错误,请重新输入!");
lockpwd.value="";
lockpwd.focus();
return false;}
}
function getcookie(name)       //获取cookies,用来验证输入的密码
{
    var aCookie = document.cookie.split("; ");   //取得所有cookies,并放置到数组中:[cookie名=值]
    for (var i=0; i < aCookie.length; i++)     //遍历所有cookies
{
   aCrumb = aCookie[i].split("=");     //将cookie名和值分开
    if (name==aCrumb[0])        //验证cookie名
    { return aCrumb[1]; }        //返回cookie值
}
}
-->
</script>
<style>
<!--
body{overflow-y:visible;overflow-x:visible; }
body,div,input{text-align:center;font-size:10pt;font-face:微软雅黑;}
input{height:20;}
#lockbtn{float:left;margin-left:50px;cursor:hand;}
#lockform,#locklayer{
position: absolute;
width:expression(this.parentNode.scrollWidth);
top:expression(this.parentNode.scrollTop);
left=0; height:100%;right:0; bottom:0;
}
#lockform { z-index:1}
#locklayer{ z-index:1;background-color:#AAA;filter:alpha(opacity=50);}
#locktab{
position: absolute;
top:250px;left:expression(this.parentNode.scrollWidth/2-100);
background-color:#FDFEFF; z-index:2;width:200px;height:60px;
border-style: solid; border-width: 1px;border-color:green;color:red;
}
#lockck{border:0;background:fff;color:red;}
-->
</style>

<body>
<div id="lockbtn" οnclick="lock(lockform);">锁定</div>
<div id="lockform" style="display:none;">
<div id="locklayer"></div>
<div id="locktab">
<input id="lockck" type="submit" value="请输入解锁密码:" οnfοcus="cklock();" >
<div><input id="lockpwd" type="password" name="lockpwd" οnfοcus="this.value=''" size=16></div>
</div>
</div>
</body>

方法2

<!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Strict//EN"  
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  <html   xmlns="http://www.w3.org/1999/xhtml"   xml:lang="gb2312"   >  
  <script>  
  function   _debug(msg)  
  {  
  alert(msg);  
  document.getElementById('search').focus();  
  }  
  </script>  
   
  <head   οnlοad="javascript:_debug(aa);">  
  <meta   http-equiv="content-type"   content="text/html;   charset=gb2312"   />  
  <meta   name="author"   content="Smiling   Dolphin"   />  
  <meta   name="keywords"   content="design,   css,   cascading,   style,   sheets,   xhtml,   graphic   design,   w3c,   web   standards,   visual,   display,   java,   javascript,   c++,   php,   jsp,   asp,   py,   pl"   />  
  <meta   name="description"   content="my   favorites   language."   />  
  <meta   name="robots"   content="all"   />  
  <title>Dolphin   Document</title>  
  </head>  
  <body>  
  <input   type="button"   value="显示Alert"   οnclick="alert('我改写了Alert显示的样式')"   />  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <input   name   =   "search"   id="search"   type="text"   />  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <p>abc</p>  
  <script   language="javascript"   type="text/javascript">  
  window.alert   =   function(txt)  
  {  
  //document.write(txt);  
  var   shield   =   document.createElement("DIV");  
  shield.style.position   =   "absolute";  
  shield.style.left   =   "0px";  
  // shield.id   =   "shield";  
  shield.style.top   =   "0px";  
  shield.style.width   =   "100%";  
  shield.style.height   =   document.body.clientHeight+"px";  
  shield.style.background   =   "#333";  
  shield.style.textAlign   =   "center";  
  // shield.style.lineHeight   =   document.body.clientHeight+"px";  
  shield.style.zIndex   =   "1";  
  shield.style.filter   =   "alpha(opacity=0)";  
  var   alertFram   =   document.createElement("DIV");  
  alertFram.style.position   =   "absolute";  
  alertFram.style.left   =   "50%";  
  alertFram.style.top   =   "50%";  
  alertFram.style.marginLeft   =   "-225px";  
  alertFram.style.marginTop   =   "-75px";  
  alertFram.style.width   =   "450px";  
  alertFram.style.height   =   "150px";  
  alertFram.style.background   =   "#ccc";  
  alertFram.style.textAlign   =   "center";  
  alertFram.style.lineHeight   =   "150px";  
  alertFram.style.zIndex   =   "2";  
  strHtml     =   "<ul   style=/"list-style:none;margin:0px;padding:0px;width:100%/">/n";  
  strHtml   +=   " <li   style=/"background:#DD828D;text-align:left;padding-left:20px;font-weight:bold;height:25px;line-height:25px;border:1px   solid   #F9CADE;/">[系统提示]</li>/n";  
  strHtml   +=   " <li   style=/"background:#fff;text-align:center;font-weight:bold;height:120px;line-height:120px;border-left:1px   solid   #F9CADE;border-right:1px   solid   #F9CADE;/">"+txt+"</li>/n";  
  strHtml   +=   " <li   style=/"background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px;   border:1px   solid   #F9CADE;/"><input   type=/"button/"   value=/"确   定/"   οnclick=/"doOk()/"   /></li>/n";  
  strHtml   +=   "</ul>/n";  
  alertFram.innerHTML   =   strHtml;  
  document.body.appendChild(alertFram);  
  document.body.appendChild(shield);  
  var   c   =   0;  
  this.doAlpha   =   function(){  
  if   (c++   >   10){clearInterval(ad);return   0;}  
  shield.style.filter   =   "alpha(opacity="+c+");";  
  }  
  var   ad   =   setInterval("doAlpha()",20);  
  this.doOk   =   function(){  
  alertFram.style.display   =   "none";  
  shield.style.display   =   "none";  
  }  
  }  
  </script>  
   
  </body>  
  </html>

js弹出图层锁定页面相关推荐

  1. php网站自动变暗,如何使用JS弹出DIV并使整个页面背景变暗

    这次给大家带来如何使用JS弹出DIV并使整个页面背景变暗,使用JS弹出DIV并使整个页面背景变暗的注意事项有哪些,下面就是实战案例,一起来看一下. 1.首先写一个遮罩层p,然后再写一个弹窗的p 提示 ...

  2. JS弹出DIV并使整个页面背景变暗功能的实现代码

    1.首先写一个遮罩层div,然后再写一个弹窗的div <!-- 遮罩层 --> <div id="cover" style="background: # ...

  3. html弹出层全覆盖滚动条,JS弹出层遮罩,隐藏背景页面滚动条细节优化分析

    一.去除滚动条方法 给body添加overflow:hidden属性即可,IE6.7下不会生效,需要给html增加overflow:hidden属性 样式中需要对IE6.7及其它浏览器用hack辨别, ...

  4. js 弹出子页面与关闭子页面刷新父页面的问题

    在使用js弹出子页面并在关闭子页面的时候刷新父页面的时候遇到不能刷新的问题,为这个事郁闷了好久,在网上找相关的资料基本上都是使用window.opener.location.href=window.o ...

  5. html关闭页面弹出再见信息提示框,js弹出框、对话框、提示框、弹窗总结

    一.JS的三种最常见的对话框//====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 functi ...

  6. php提交表单关闭弹出层,使用js实现关闭js弹出层的窗口

    本篇文章主要是对使用js实现关闭js弹出层的窗口的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 function toggle() { theObj = document.getE ...

  7. js弹出对话框的方法总结

    1.最基本的js弹出对话框窗口代码 <script LANGUAGE="javascript"> window.open (" 地址 ") < ...

  8. JS弹出窗口的运用与技巧(转)

    //关闭,父窗口弹出对话框,子窗口直接关闭 this.Response.Write("<script language=javascript>window.close();< ...

  9. js弹出框、对话框、提示框、弹窗总结

    一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ========================//弹出对话框并输出一段提示信息functio ...

最新文章

  1. 剑指offer九:变态跳台阶
  2. 使用python装饰器计算函数运行时间的实例
  3. 【CodeForces - 264A】Escape from Stones (模拟,卡精度的处理)
  4. HDU-1069 Monkey and Banana
  5. 信息学奥赛一本通(1328:【例7.7】光荣的梦想)
  6. php http agent,PHP通过http头user-agent判断是否为手机浏览器
  7. JavaScript中setInterval的参数传递个人归纳
  8. ZooKeeper 到底解决了什么问题?
  9. 12864液晶显示原理(C程序)
  10. c语言字段宽度,2.6.3 控制输出的字段宽度
  11. KNN聚类的原理和实现
  12. Unity 视频编码器问题解决方案(视频卡顿,花屏,黑屏)
  13. 预测分析:R语言实现2.4 评估线性回归模型
  14. 从人脸识别到唇语识别,图像识别技术发展现状
  15. android系统视频剪辑app推荐,知乎10w人收藏:玩短视频必装的9款剪辑App(最全)...
  16. 用于CTF(MISC)的kali虚拟机更改过程记录
  17. Java遍历jar包所有类-后续
  18. Leecode 1658. 将 x 减到 0 的最小操作数 滑动窗口
  19. 视频文件头解析--MP4-综述
  20. 安全狗导致网站程序池被禁用_如何在Microsoft Office程序中禁用安全警告消息栏...

热门文章

  1. 支付宝手势密码安全吗?
  2. 【图像评价】基于matlab GUI图像评价系统【含Matlab源码 2185期】
  3. 3.5-学习障碍儿童
  4. 微信理财通和余额宝哪个好
  5. 第三周作业1(1)嘎嘎嘎
  6. 开始试用Dynamics 365
  7. 台服海岛纪元显示无法连接服务器,海岛纪元(全球服)总是显示无法连接网络...
  8. 【Unity】Unity 3D中的内存管理
  9. Element UI报错:Unknown custom element: el-menu
  10. 保研夏令营/预推免联系导师