JavaScript父窗口控制只弹出一个子窗口的实现方法

基于Cookie的旧方案分析

网络上关于如何在父窗口中限制只弹出一个子窗口的讨论很多，但常见的解决方案往往存在局限性或实现过于繁琐，不够完善。例如，有些方案依赖Cookie来记录状态，具体实现如下所示。

主要需求是：在主页点击链接弹出窗口后，再次访问或返回主页时不再重复弹出该窗口。

<script>

window.open("http://www.yeboss.com.cn","yeboss","width=300,height=400")

</script>

Cookie方案

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

var expDays = 1; // number of days the cookie should last

var page = "only-popup-once.html";

var windowprops = "width=300,height=200,location=no,toolbar=no,menubar=no,scrollbars=no,resizable=yes";

function GetCookie (name) {

var arg = name + "=";

var alen = arg.length;

var clen = document.cookie.length;

var i = 0;

while (i < clen) {

var j = i + alen;

if (document.cookie.substring(i, j) == arg)

return getCookieVal (j);

i = document.cookie.indexOf(" ", i) + 1;

if (i == 0) break;

return null;

function SetCookie (name, value) {

var argv = SetCookie.arguments;

var argc = SetCookie.arguments.length;

var expires = (argc > 2) ? argv[2] : null;

var path = (argc > 3) ? argv[3] : null;

var domain = (argc > 4) ? argv[4] : null;

var secure = (argc > 5) ? argv[5] : false;

document.cookie = name + "=" + escape (value) +

((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +

((path == null) ? "" : ("; path=" + path)) +

((domain == null) ? "" : ("; domain=" + domain)) +

((secure == true) ? "; secure" : "");

function DeleteCookie (name) {

var exp = new Date();

exp.setTime (exp.getTime() - 1);

var cval = GetCookie (name);

document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();

var exp = new Date();

exp.setTime(exp.getTime() + (expDays*24*60*60*1000));

function amt(){

var count = GetCookie(’count’)

if(count == null) {

SetCookie(’count’,’1’)

return 1

else {

var newcount = parseInt(count) + 1;

DeleteCookie(’count’)

SetCookie(’count’,newcount,exp)

return count

function getCookieVal(offset) {

var endstr = document.cookie.indexOf (";", offset);

if (endstr == -1)

endstr = document.cookie.length;

return unescape(document.cookie.substring(offset, endstr));

function checkCount() {

var count = GetCookie(’count’);

if (count == null) {

count=1;

SetCookie(’count’, count, exp);

window.open(page, "", windowprops);

else {

count++;

SetCookie(’count’, count, exp);

// End -->

</script>

<BODY OnLoad="checkCount()">

基于窗口引用的简洁方案

上述基于Cookie的例子代码量大且逻辑复杂，不易理解。下面介绍一种更简洁、易用的新方法。

<script language="JavaScript" type="text/JavaScript">

<!-- Copyright fenggang at 2007/3/23

var w=null;

function MM_openBrWindow(theURL,winName,features) { //v2.0

if(w!=undefined&&isOpen()){

w.close();

w=window.open("",winName,features);

w.location.replace(theURL);

function isOpen()

try

w.document;

return true;

catch(ex)

return false;

</script>

该方案复用了Dreamweaver中常见的MM_openBrWindow函数名。将此段核心代码嵌入页面后，再次触发弹出窗口时，程序会先检查是否存在已打开的窗口对象。

通过上述核心逻辑，即可实现只允许一个子窗口弹出的效果。以下是完整的测试页面代码，供参考验证。

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<script language="JavaScript" type="text/JavaScript">

<!-- Copyright fenggang at 2007/3/23

var w=null;

function MM_openBrWindow(theURL,winName,features) { //v2.0

if(w!=undefined&&isOpen()){

w.close();

w=window.open("",winName,features);

w.location.replace(theURL);

function isOpen()

try

w.document;

return true;

catch(ex)

return false;

</script>

</head>

<body>

<a href="javascript:;" onClick="MM_openBrWindow(show.asp’,’’,’scrollbars=yes,resizable=yes,width=570,height=500’)">title</a>

</body>

</html>