分享
 
 
 

再论弹出窗口

王朝other·作者佚名  2008-05-31
窄屏简体版  字體: |||超大  

前文已经比较具体地谈过“pop window”的一些写法和技巧,现在再对一些没有涉及的内容做一些补充。

希望对大家有一些帮助。

(一)我们可以不用window.open的方法打开一个窗口,用下面的方法也可以作到:

代码如下:

<form action="example2.htm" target="anotherWindowName">

<input type="SUBMIT" value="Open new window" name="SUBMIT">

</form>

(二)下面的例子首先用传统的方法打开一个小窗口,然后通过右面的连接将一个新的内容写入这个弹出的窗口中。

将文件调入弹出的窗口

代码如下:

<script language="javascript">

<!--

function openwin(){

window.open(′sample1.htm′,′myWindow′);

}

//-->

</script>

<a href="sample2.htm" target="myWindow">将文件写入弹出窗口</a>

(三)假如要显示一张图片,下面的方法也可以:

<form>

<input type="BUTTON" onClick="window.open(′picture.gif′,′′,′width=150,height=100′)" name="BUTTON" value="open picture">

</form>

(四)下面是一个弹出窗口的生成器:

URL Name Width Height Directories Location Menubar Scrollbars Status Toolbar Resizeable

源代码如下:

<SCRIPT LANGUAGE="JavaScript">

<!--

function createWindow(what) {

var URL = what.URL.value;

var windowName = what.windowName.value;

var features =

′width=′ + what.width.value +

′,height=′ + what.height.value +

′,directories=′ + (what.directories.checked - 0) +

′,location=′ + (what.location.checked - 0) +

′,menubar=′ + (what.menubar.checked - 0) +

′,scrollbars=′ + (what.scrollbars.checked - 0) +

′,status=′ + (what.status.checked - 0) +

′,toolbar=′ + (what.toolbar.checked - 0) +

′,Resizeable=′ + (what.Resizeable.checked - 0);

window.open (URL, windowName, features);

}

//--></SCRIPT>

<FORM>

URL <INPUT TYPE="TEXT" NAME="URL" VALUE="testpage.htm">

Name <INPUT TYPE="TEXT" NAME="windowName" VALUE="myWindow">

Width <INPUT TYPE="TEXT" NAME="width" VALUE="200">

Height <INPUT TYPE="TEXT" NAME="height" VALUE="200">

<INPUT TYPE="CHECKBOX" NAME="directories"> Directories

<INPUT TYPE="CHECKBOX" NAME="location"> Location

<INPUT TYPE="CHECKBOX" NAME="menubar"> Menubar

<INPUT TYPE="CHECKBOX" NAME="scrollbars"> Scrollbars

<INPUT TYPE="CHECKBOX" NAME="status"> Status

<INPUT TYPE="CHECKBOX" NAME="toolbar"> Toolbar

<INPUT TYPE="CHECKBOX" NAME="Resizeable"> Resizeable

<INPUT TYPE="BUTTON" VALUE="Create It"

onClick="createWindow(this.form)">

</FORM>

(五)弹出窗口是非常轻易失去“焦点”的,即只要鼠标点击窗口以外的任意位置该弹出窗口的焦点就失去了。

用下面的方法可以对其进行控制,将如下代码加入弹出窗口中:

<BODY onBlur="window.focus()">

但是,这样做有一个缺陷,即弹出的窗口永远被“聚焦”了,除非你强制关闭它。

没有关系,只要给它加一个“超时控制”即可,即让它只聚焦几秒钟,在这段事件内,访问者有足够的时间看清楚弹出窗口内的内容,然后只要用鼠标点窗口以外的任意位置,就自动关闭了。

<BODY onBlur="setTimeout=(′window.focus()′,1000)">

<BODY onBlur="window.close()">

(六)定位你的窗口,使用screenX ,screenY(NS4) ,top ,left(IE4) 属性。

window.open(′testpage.htm′,′myExample6′,′width=200,height=200,screenX=400,screenY=400,top=400,left=400′);

(七)有没有想过让你的窗口永远居中?即不论窗口的大小时多少,一律显示在窗口的中间?用下面的脚本即可:

<SCRIPT LANGUAGE="JavaScript">

<!--

function centerWindow() {

if (document.all)

var xMax = screen.width, yMax = screen.height;

else

if (document.layers)

var xMax = window.outerWidth, yMax = window.outerHeight;

else

var xMax = 640, yMax=480;

var xOffset = (xMax - 200)/2, yOffset = (yMax - 200)/2;

window.open(′center.htm′,′myExample7′, ′width=200,height=200,screenX=′+xOffset+′,screenY=′+yOffset+′, top=′+yOffset+′,left=′+xOffset+′′);

}

centerWindow();

//-->

</SCRIPT>

注重:本例的打开的窗口是200*200的,假如你的窗口不是这个尺寸,将上面的兰色部分改一下即可。

测试一下吧:

(八)下面的代码可以实现窗口内容的转跳,先打开一个窗口,经过3秒钟后页面自动跳转到另一个页面。

<SCRIPT LANGUAGE="JavaScript">

<!--

myWindow8 = window.open(′blank.htm′,′myExample8′,′width=200,height=200′);

setTimeout("myWindow8.location.href = ′testpage.htm′",3000);

//-->

</SCRIPT>

(九)窗口内容的重写:

<SCRIPT LANGUAGE="JavaScript">

<!--

msgWindow9 = window.open(′testpage.htm′,′myExample9′,′width=200,height=200′);

function update() {

for (var i=0; i < 10; i++)

msgWindow9.document.write(′Message number ′ + i + ′<BR>′);

}

setTimeout(′update()′,3000); //3秒钟后写入。

//-->

</SCRIPT>

说明:注重兰色部分相同,本例使用了一个循环写,作为演示比较清楚,你可以使用.document.write的方法将任何内容写入窗口中。

--------------------------------------------------------------------------------

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有