JavaScript实现弹窗及其自定义设置

3星 · 超过75%的资源需积分: 3 74 浏览量更新于2024-07-30 收藏 50KB DOC 举报

"网页精华代码集.doc" 是一个包含网页编程相关代码的文档，主要讨论了如何使用JavaScript实现弹出窗口的功能。在网页开发中，弹出窗口是一种常见的交互方式，用于显示额外的信息或者引导用户操作。文档首先介绍了最基础的弹出窗口代码： ```html <SCRIPT LANGUAGE=javascript>  </SCRIPT> ``` 这段代码的核心是`window.open()`函数，它负责打开一个新的浏览器窗口。`'page.html'`是被打开的页面的URL，可以是绝对路径或相对路径。`<SCRIPT>`标签用于定义JavaScript代码，``是为了兼容旧版浏览器，防止它们将JavaScript代码当作普通文本显示。接着，文档提到了代码的放置位置，可以在`<head>`和`<head>`之间，也可以在`<body>`和`</body>`之间。放置位置的不同会影响到代码的执行时机，越靠前，代码执行越早，如果页面加载时间较长且希望尽早弹出窗口，建议将其置于前面。然后，文档进一步讲解了如何定制弹出窗口的外观和行为： ```html <SCRIPT LANGUAGE=javascript>  </SCRIPT> ``` 这段代码添加了更多的参数，如窗口名称`'newwindow'`，以及一系列定制窗口属性的参数，如高度`height=100`，宽度`width=400`，以及窗口在屏幕上的位置等。其他参数如`toolbar=no`、`menubar=no`、`scrollbars=no`等分别用于禁用工具栏、菜单栏和滚动条，`resizable=no`则禁止用户改变窗口大小，`location=no`和`status=no`则隐藏地址栏和状态栏。通过这些参数，开发者能够根据实际需求创建符合用户体验的弹出窗口，提供更加个性化的浏览环境。对于网页开发者来说，熟练掌握这些技巧能提升网页的交互性和用户体验。在实际应用中，可以根据需要调整参数值，以适应不同的网页设计和用户需求。

window.open (page2.html, newwindow2, height=100, width=100, top=100, left=100,toolbar=no, menubar=no,

scrollbars=no, resizable=no, location=no, status=no)

//写成一行

}

//-->

</script>

　　为避免弹出的 2 个窗口覆盖，用 top 和 left 控制一下弹出的位置不要相互覆盖即可。最后用上面说过

的四种方法调用即可。

注意：2 个窗口的 name(newwindows 和 newwindow2)不要相同，或者干脆全部为空。OK？

　　【5、主窗口打开文件 1.htm，同时弹出小窗口 page.html】

　　如下代码加入主窗口<head>区：

<!--

function openwin() {

window.open(page.html,,width=200,height=200)

}

//-->

</script>

加入<body>区：

<a href=1.htm onclick=openwin()>open</a>即可。

　　【6、弹出的窗口之定时关闭控制】

　　下面我们再对弹出的窗口进行一些控制，效果就更好了。如果我们再将一小段代码加入弹出的页面

(注意是加入到 page.html 的 HTML 中，可不是主页面中，否则...)，让它 10 秒后自动关闭是不是更酷了？

　　首先，将如下代码加入 page.html 文件的<head>区：

function closeit() {

setTimeout(self.close(),10000) //毫秒

}

</script>

　然后，再用<body onload=closeit()> 这一句话代替 page.html 中原有的<BODY>这一句就可以了。(这一句

话千万不要忘记写啊！这一句的作用是调用关闭窗口的代码，10 秒钟后就自行关闭该窗口。)

剩余14页未读，继续阅读

zj小潘

粉丝: 5
资源: 19

JavaScript实现弹窗及其自定义设置

Spire.Doc 去水印版本.

java聊天系统代码..doc

学生来源代码本.doc

Visual C++实践与提高-COM和COM+篇（高清pdf + 随书源代码）.part2

Visual C++实践与提高-COM和COM+篇（高清pdf + 随书源代码）.part1

爱情表白专用html5动画网页的代码

web课程设计网页设计源代码

微信小程序源码-合集5.rar

微信小程序源码-合集3.rar

YOLOV5口罩检测数据集+代码+模型 2000张标注好的数据+教学视频.zip

最新资源