我是为了一个仍在开发中的电子商务网站(eMirage)编写这个程序的。与其强迫用户等待所有的产品图片下载完毕,我选择将图片显示在一个弹出窗口中。两个图片用同一个窗口显示,而且没有独立的 HTML 文件。下面是具体方法:

var faux = null;
varpic = new Image();

function copyCat(pic) {
faux = window.open('','newWin','dependent,resizable,top=20,left=20,width=273,height=230');
varfd = faux.document;
fd.open();
fd.write('<html><head><title>midnight @ the oasis</title></head>');
fd.write('<body bgcolor="black" onLoad="window.focus()">');
fd.write('<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">');
fd.write('<tr><td align="center" valign="middle"><imgsrc="' + 'graphics/' + pic + '.jpg"></td></tr>');
fd.write('</table></body></html>');
fd.close();
}

函数copyCat() 会打开新窗口并且将内容写入新打开的窗口。变量pic开始被声明为一个 image 对象,它会被放入 HTML 代码中,然后被作为一个参数传给copyCat()。这样能够让函数调用指定图片的名字。例如,这个技巧的第一个例子使用了下面的方式来调用copyCat() 函数:

<a href="javascript:copyCat('sg005')"></a>

将内容写入窗口对象里面有时候会让人感到很气馁。比方说,请注意在copyCat() 函数里面,变量pic的子目录路径必须作为一个独立的字符串,否则程序便无法正常运作:

fd.write('<tr><td align="center" valign="middle">
<imgsrc="' + 'graphics/' + pic + '.jpg"></td></tr>');

实现这个技巧不仅让网站设计者重复使用同一个窗口函数(copyCat()),还可以避免产生一大堆 HTML 档案,简化网站管理。