Javascript实现百分百的弹出窗口代码参考

来源:网络整理 责任编辑:栏目编辑 发表时间:2013-07-02 02:29 点击:

优点:兼容性很好,而且俺觉得不应该有什么拦截工具可以拦截下来
优点:代码非常短
缺点:必须在页面点击后才会弹出

demo:

运行代码框

 

<head>
<style>
#link001 img { border-style:none; }
</style>
<script>
function cancelOpenNew(){
 if(!window.event){setTimeout(cancelOpenNewA,1000);return;}
 var obj=window.event.srcElement;
 if(!obj)return;
 if(!obj.tagName)return;
 if(String(obj.tagName).match(/input|select|option|textarea/i))return;
 setTimeout(cancelOpenNewA,1000);
}

function cancelOpenNewA(){document.body.appendChild(document.getElementById('MainDiv001'));}
</script>
</head>
<body>
<a href="http://www.blueidea.com" target="_blank" onclick="cancelOpenNew();" id="link001" style="color:black; text-decoration:none; cursor:default; display:block;" hidefocus="true">
<div id="MainDiv001">

 

<!-- This is a comment -->
This is a test. <br>
I try to put something here.<br>
<input />
<br>
<div >
 This is a div.
</div>
<ol>
 <li><img src="http://www.blueidea.com/articleimg/bbsimg/closedb.gif"/> And this</li>
 <li><img src="http://www.blueidea.com/articleimg/bbsimg/closed.gif"/> is a list</li>
</ol>

<form>
 This is a Form.
 <input /><input type="checkbox" />
 <input type="radio" name="hutia" value="1" /><input type="radio" name="hutia" value="0" />
 <select><option>This is a select</option>
  <option>This is a select</option>
 </select>
 <textarea> And here is a textarea</textarea>
 <input type="button" value="button" />
 <input type="submit" value="submit" />
 <input type="reset" value="reset" />
</form>

<iframe src="http://www.blueidea.com"></iframe>
<!-- This is another comment -->


</div>
</a>
</body>

说明:

1.为了保证页面中的 img 不会出现丑陋的边框

<style>
#link001 img { border-style:none; }
</style>

2.保证窗口只弹出一次

<script>
function cancelOpenNew(){
 if(!window.event){setTimeout(cancelOpenNewA,1000);return;}
 var obj=window.event.srcElement;
 if(!obj)return;
 if(!obj.tagName)return;
 if(String(obj.tagName).match(/input|select|option|textarea/i))return;
 setTimeout(cancelOpenNewA,1000);
}

function cancelOpenNewA(){document.body.appendChild(document.getElementById('MainDiv001'));}
</script>

3.这个结构是弹窗的根本---其实只不过是个 target="_blank" 的链接而已,拦截程序要是连这个都要拦,俺也无话可说

<body>
<a href="http://www.blueidea.com" target="_blank" onclick="cancelOpenNew();" id="link001" style="color:black; text-decoration:none; cursor:default; display:block;" hidefocus="true">
<div id="MainDiv001">

4.千万不要忘记在页面结束的地方加上:

</div>
</a>
</body>

    发表评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    用户名: 验证码:点击我更换图片
    最新评论 更多>>

    推荐热点

    • Gb2312转utf-8编码的方法(vbs+js)
    • 如何使用Ajax技术开发Web应用程序(1)
    • js跳转路径问题
    • JavaScript模仿桌面窗口
    • 用js检测两个线段是否相交
    • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
    • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
    • 我是如何去了解jquery的(六),案例之幻灯片轮换
    • Jquery封装幻灯片效果
    网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
    Copyright © 2008-2015 计算机技术学习交流网. 版权所有

    豫ICP备11007008号-1