Javascript弹窗代码大全

合集下载

Javascript弹窗代码大全(收集)

弹窗代码大全(收集)以下包括强制弹窗 24小时IP弹窗延时弹窗退弹等我们使用cookie来控制一下就可以了。

首先，将如下代码加入主页面html的<head>区：<script>function openwin(){window.open(”page.html”,”",”width=200,height=200″)}function get_cookie(name){var search = name + “=”var returnvalue = “”;if (documents.cookie.length > 0) {offset = documents.cookie.indexof(search)if (offset != -1) {offset += search.lengthend = documents.cookie.indexof(”;”, offset);if (end == -1)end = documents.cookie.length;returnvalue=”/unescape(documents.cookie.substring(offset,end))”}}return returnvalue;}function loadpopup(){if (get_cookie(’popped’)==”){openwin()documents.cookie=”popped=yes”}}</script>然后，用<body onload=”loadpopup()”>（注意不是openwin而是loadpop啊！）替换主页面中原有的<body>这一句即可。

你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。

真正的pop-only-once！写到这里弹出窗口的制作和应用技巧基本上算是完成了，俺也累坏了，一口气说了这么多，希望对正在制作网页的朋友有所帮助俺就非常欣慰了。

JS代码大全

JS代码⼤全1. 将彻底屏蔽⿏标右键oncontextmenu="window.event.returnvalue=false"<table border oncontextmenu=return(false)><td>no</table>可⽤于Table2. 取消选取、防⽌复制<body onselectstart="return false">3. 不准粘贴onpaste="return false"4. 防⽌复制oncopy="return false;" oncut="return false;"5. IE地址栏前换成⾃⼰的图标<link rel="Shortcut Icon" href="favicon.ico">6. 可以在收藏夹中显⽰出你的图标<link rel="Bookmark" href="favicon.ico">7. 关闭输⼊法<input style="ime-mode:-Disabled">8. 永远都会带着框架<script language="javascript"></script>9. 防⽌被⼈frame<SCRIPT LANGUAGE=javascript></SCRIPT>10. ⽹页将不能被另存为<noscript><iframe src=*.html></iframe></noscript>11. 查看⽹页源代码<input type=button value=查看⽹页源代码onclick="window.location = `view-source:`+ /`";>12.删除时确认<a href=`javascript:if(confirm("确实要删除吗?"location="boos.asp?&areyou=删除&page=1"`>删除</a>13. 取得控件的绝对位置//javascript<script language="javascript">function getIE(E){var t=e.offsetTop;var l=e.offsetLeft;while(e=e.offsetParent){t+=e.offsetTop;l+=e.offsetLeft;}alert("top="+t+"/nleft="+l);}</script>//VBScript<script language="VBScript"></script>14. 光标是停在⽂本框⽂字的最后<script language="javascript">function cc(){var e = event.srcElement;var r =e.createTextRange();r.moveStart(`character`,e.value.length);r.collapse(true);r.select();}</script><input type=text name=text1 value="123" onfocus="cc()">15. 判断上⼀页的来源javascript:document.referrer16. 最⼩化、最⼤化、关闭窗⼝<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"><param name="Command" value="Minimize"></object><object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"><param name="Command" value="Maximize"></object><OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"><PARAM NAME="Command" value="Close"></OBJECT><input type=button value=最⼩化onclick=hh1.Click()><input type=button value=最⼤化onclick=hh2.Click()><input type=button value=关闭onclick=hh3.Click()>本例适⽤于IE17.屏蔽功能键Shift,Alt,Ctrl<script>function look(){if(event.shiftKey)alert("禁⽌按Shift键!"; //可以换成ALT CTRL}document.onkeydown=look;</script>18. ⽹页不会被缓存<META HTTP-EQUIV="pragma" CONTENT="no-cache"><META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"><META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">或者<META HTTP-EQUIV="expires" CONTENT="0">19.怎样让表单没有凹凸感？<input type=text style="border:1 solid #000000">或<input type=text style="border-left:none; border-right:none; border-top:none; border-bottom: 1 solid #000000"></textarea>20.<div><span>&<layer>的区别？<div>(division)⽤来定义⼤段的页⾯元素，会产⽣转⾏<span>⽤来定义同⼀⾏内的元素，跟<div>的唯⼀区别是不产⽣转⾏<layer>是ns的标记，ie不⽀持，相当于<div>21.让弹出窗⼝总是在最上⾯:<body onblur="this.focus();">22.不要滚动条?让竖条没有:<body style=`overflow:-Scroll;overflow-y:hidden`></body>让横条没有:<body style=`overflow:-Scroll;overflow-x:hidden`></body>两个都去掉？更简单了<body scroll="no"></body>23.怎样去掉图⽚链接点击后，图⽚周围的虚线？<a href="#" onFocus="this.blur()"><img src="logo.jpg" border=0></a>24.电⼦邮件处理提交表单<form name="form1" method="post" action="mailto***@***.com" enctype="text/plain"><input type=submit></form>25.在打开的⼦窗⼝刷新⽗窗⼝的代码⾥如何写？window.opener.location.reload()26.如何设定打开页⾯的⼤⼩<body onload="top.resizeTo(300,200);">打开页⾯的位置<body onload="top.moveBy(300,200);">27.在页⾯中如何加⼊不是满铺的背景图⽚,拉动页⾯时背景图不动<style>body{background-image:url(logo.gif); background-repeat:no-repeat;background-position:center;background-attachment: fixed}</style>28. 检查⼀段字符串是否全由数字组成<script language="javascript"></script>29. 获得⼀个窗⼝的⼤⼩document.body.clientWidth;document.body.clientHeight30. 怎么判断是否是字符if (/[^/x00-/xff]/g.test(s)) alert("含有汉字";else alert("全是字符";31.TEXTAREA⾃适应⽂字⾏数的多少<textarea rows=1 name=s1 cols=27 onpropertychange="this.style.posHeight=this.scrollHeight"> </textarea>32. ⽇期减去天数等于第⼆个⽇期<script language=javascript>function cc(dd,dadd){//可以加上错误处理var a = new Date(dd)a = a.valueOf()a = a - dadd * 24 * 60 * 60 * 1000a = new Date(A)alert(a.getFullYear() + "年" + (a.getMonth() + 1) + "⽉" + a.getDate() + "⽇"}cc("12/23/2002",2)</script>33. 选择了哪⼀个Radio<HTML><script language="vbscript">function checkme()for each ob in radio1if ob.checked then window.alert ob.valuenextend function</script><BODY><INPUT name="radio1" type="radio" value="style" checked>style<INPUT name="radio1" type="radio" value="barcode">Barcode<INPUT type="button" value="check" onclick="checkme()"></BODY></HTML>34.脚本永不出错<SCRIPT LANGUAGE="javascript"></SCRIPT>35.ENTER键可以让光标移到下⼀个输⼊框<input onkeydown="if(event.keyCode==13)event.keyCode=9">36. 检测某个⽹站的链接速度：把如下代码加⼊<body>区域中:<script language=javascript>tim=1setInterval("tim++",100)b=1var autourl=new Array()autourl[1]="/";autourl[2]=""autourl[3]="/";autourl[4]="/";autourl[5]="/";function butt(){document.write("<form name=autof>"for(var i=1;i<autourl.length;i++)document.write("<input type=text name=txt"+i+" size=10 value=测试中……> =》<input type=text name=url"+i+" size=40> =》<input type=button value=GOonclick=window.open(this.form.url"+i+".value)><br>"document.write("<input type=submit value=刷新></form>"}butt()function auto(url){document.forms[0]["url"+b].value=urlif(tim>200){document.forms[0]["txt"+b].value="链接超时"}else{document.forms[0]["txt"+b].value="时间"+tim/10+"秒"}b++}function run(){for(var i=1;i<autourl.length;i++)document.write("<imgsrc=http://"+autourl+"/"+Math.random()+" width=1 height=1onerror=auto(http://";+autourl+"`)>"}run()</script>37. 各种样式的光标auto ：标准光标default ：标准箭头hand ：⼿形光标wait ：等待光标text ：I形光标vertical-text ：⽔平I形光标no-drop ：不可拖动光标not-allowed ：⽆效光标help ：?帮助光标all-scroll ：三⾓⽅向标move ：移动标crosshair ：⼗字标e-resizen-resizenw-resizew-resizes-resizese-resizesw-resize38.页⾯进⼊和退出的特效进⼊页⾯<meta http-equiv="Page-Enter" content="revealTrans(duration=x, transition=y)">推出页⾯<meta http-equiv="Page-Exit" content="revealTrans(duration=x, transition=y)">这个是页⾯被载⼊和调出时的⼀些特效。

各类漂浮广告代码、弹窗广告代码大全

-->
</SCRIPT>
参数解释：
<SCRIPT LANGUAGE="java script"> js脚本开始；
window.open 弹出新窗口的命令；
'page.html' 弹出窗口的文件名；
'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空''代替；
window.open(′url′,′窗口名′,′属性列表′);
〈/script〉
其中“url”是在窗口中显示的html文档的地址；“窗口名”可任意起一个，但不要用中文；“属性列表”是一个用逗号分开的各个属性值的字符串，它确定了弹出窗口的外观与状态。常用属性有：
toolbar（是否显示工具栏
将下面这段代码插入你的页面中，在页面加载时就会自动弹出一个窗口，并打开Google搜索引擎，是不是很简单啊！
将代码放置在〈!?XXX --〉中间是为了兼容较低版本浏览器的需要，在低版本的浏览器中标签内的内容将被视作注视。
打开的页面使用绝对路径（http://）或相对路径（../page.htm）都可以。
-->
</script>
然后，在相同目录下新建一个popup.htm网页(注意要与上面的url对应!)，用于显示在弹出窗口中。在新建文件的源代码中加入如下代码：
代码：
<script language="java script">
function closeit() {
setTimeout("self.close()",10000)

[JS]九种网页弹窗代码

[JS]九种⽹页弹窗代码【1、最基本的弹出窗⼝代码】其实代码⾮常简单：<SCRIPT LANGUAGE="javascript"></SCRIPT>因为着是⼀段javascripts代码，所以它们应该放在<SCRIPT LANGUAGE="javascript">标签和</script>之间。

是对⼀些版本低的浏览器起作⽤，在这些⽼浏览器中不会将标签中的代码作为⽂本显⽰出来。

要养成这个好习惯啊。

window.open (page.html) ⽤于控制弹出新的窗⼝page.html，如果page.html不与主窗⼝在同⼀路径下，前⾯应写明路径，绝对路径(http://)和相对路径(../)均可。

⽤单引号和双引号都可以，只是不要混⽤。

这⼀段代码可以加⼊HTML的任意位置，<head>和</head>之间可以，<body>间</body>也可以，越前越早执⾏，尤其是页⾯代码长，⼜想使页⾯早点弹出就尽量往前放。

【2、经过设置后的弹出窗⼝】下⾯再说⼀说弹出窗⼝的设置。

只要再往上⾯的代码中加⼀点东西就可以了。

我们来定制这个弹出的窗⼝的外观，尺⼨⼤⼩，弹出的位置以适应该页⾯的具体情况。

<SCRIPT LANGUAGE="javascript"></SCRIPT>参数解释：<SCRIPT LANGUAGE="javascript"> js脚本开始；window.open 弹出新窗⼝的命令；page.html 弹出窗⼝的⽂件名；newwindow 弹出窗⼝的名字（不是⽂件名），⾮必须，可⽤空代替；height=100 窗⼝⾼度；width=400 窗⼝宽度；top=0 窗⼝距离屏幕上⽅的象素值；left=0 窗⼝距离屏幕左侧的象素值；toolbar=no 是否显⽰⼯具栏，yes为显⽰；menubar，scrollbars 表⽰菜单栏和滚动栏。

23个Javascript弹出窗口特效整理

23个Javascript弹出窗口特效整理1. LightviewLightview是一个基于Prototype与开发，用于创建可以覆盖整个页面的模式对话框。

展示的内容不仅可以是图片、文字、网页、通过Ajax 调用的内容，还可以是Quicktime/Flash影片都能够以非常酷的效果展示。

2. ThickBox (演示地址)ThickBox是一个模式对话框UI控件。

基于jQuery开发，可以用来展示单张或多张图片，内嵌的内容，iframed的内容，或通过Ajax 获取的内容。

3. Fonshen JS Window (演示地址)风声JS窗口为模拟WEB弹出窗口和对话框提供一种方案。

程序基于JavaScript/X HTML/CSS标准实现。

支持自由度极高的窗口样式定制；交互方面提供模拟的按钮编程模型，可以很好的模拟对话框；另外，接口参考Javascript内置对象window的一些方法（比如：window.open, window.alert, window.confirm），简洁方便。

4. ymPrompt在web开发中，对于浏览器默认的消息提示框（如alert,confirm 等）外观无法控制，为了实现更好的界面效果，于是模拟系统的消息提示框实现了该组件。

在外观上可以通过css进行完全的控制。

调用方式简单，直接使用ymPrompt.alert()的方式调用，传入相应的参数即可。

提供四种消息类型。

分别为消息提示、成功信息、错误信息、询问信息。

5. ModalboxModalBox用于生成Web2.0风格的模式对话框。

基于Prototype 框架开发，效果类似Mac OSX的模式对话框。

内容可以通过Ajax加载或普通的HTML页面。

6. SliderWindowSliderWindow是一个基于YUI开发消息提醒滑动窗体。

7. MOOdalBox (演示地址)MOOdalBox是一个基于Mootools框架开发的Web2.0模式对话。

JS跳转页面参考代码大全

JS跳转页面参考代码第一种：<script language="javascript" type="text/javascript"> window.location.href="login.jsp?backurl="+window.location.href; </script>第二种：<script language="javascript">alert("返回");window.history.back(-1);</script>第三种：<script language="javascript">window.navigate("top.jsp");</script>第四种：<script language="JavaScript">self.location=’top.htm’;</script>第五种：<script language="javascript">alert("非法访问！");top.location=’xx.jsp’;</script>＝＝＝＝＝javascript中弹出选择框跳转到其他页面＝＝＝＝＝<script language="javascript"></script>＝＝＝＝＝javascript中弹出提示框跳转到其他页面＝＝＝＝＝<script language="javascript"></script>=================================按钮式：<INPUT name="pclog" type="button" value="GO"onClick="location.href='/'">链接式：<a href="javascript:history.go(-1)">返回上一步</a><a href="<%=Request.ServerVariables("HTTP_REFERER")%>">返回上一步</a>直接跳转式：<script>window.location.href='/';</script>开新窗口：<a href="javascript:"onClick="window.open(/','','height=500,width=611,scrollbar s=yes,status=yes')">杭州威士顿网络科技有限公司</a>。

弹出窗口代码大全

弹出窗口代码大全2006年12月08日星期五下午 10:43如何利用网页弹出各种形式的窗口，我想大家大多都是知道些的，但那种多种多样的弹出式窗口是怎么搞出来的，我们今天就来学习一下：
1.弹启一个全屏窗口
<html>
<body onload="window.open('','example01','fullscreen');">;

</SCRIPT>
参数解释：
<SCRIPT LANGUAGE="java script"> js脚本开始；
window.open 弹出新窗口的命令；
page.html 弹出新窗口的文件名；
newwindow 弹出窗口的名字（不是文件名），可用空 ″代替；

javascript弹出窗口代码大全

javascript弹出窗⼝代码⼤全如何利⽤⽹页弹出各种形式的窗⼝，我想⼤家⼤多都是知道些的，但那种多种多样的弹出式窗⼝是怎么搞出来的，今天找了⼀篇好⽂学习了： 1.弹启⼀个全屏窗⼝<html><body onload="window.open('','example01','fullscreen');">;<b></b></body></html> 2.弹启⼀个被F11化后的窗⼝<html><body onload="window.open(''','example02','channelmode');">;<b></b></body></html> 3.弹启⼀个带有收藏链接⼯具栏的窗⼝<html><body onload="window.open('','example03','width=400,height=300,directories');"><b></b></body></html> 4.⽹页对话框<html><SCRIPT LANGUAGE="javascript"></SCRIPT><b></b></body></html><html><SCRIPT LANGUAGE="javascript"></SCRIPT><b></b></body></html> showModalDialog()或是showModelessDialog() 来调⽤⽹页对话框，⾄于showModalDialog()与showModelessDialog()的区别，在于showModalDialog()打开的窗⼝（简称模式窗⼝），置在⽗窗⼝上，必须关闭才能访问⽗窗⼝(建议尽量少⽤，以免招⼈反感)；showModelessDialog()dialogHeight: iHeight 设置对话框窗⼝的⾼度。

JS弹出窗口的各种传值方法

JS弹出窗口的各种传值方法在JavaScript中，弹出窗口是一种常见的用户交互方式。

通过弹出窗口，可以显示其他页面、表单或者提示框等内容。

而传值则是在弹出窗口中传递数据的一种方式，使得弹出窗口可以获取到主页面中的数据，并在弹出窗口中进行操作。

下面将介绍JS弹出窗口的各种传值方法，包括使用URL参数、使用cookie、使用localStorage、使用sessionStorage和使用postMessage 等。

1.使用URL参数：使用URL参数是一种简单的传值方法，可以通过在URL后面添加参数的形式将数据传递给弹出窗口。

例如：```javascriptvar data = 'Hello World!';window.open(url, 'popup', 'width=500,height=500');```在弹出窗口的页面中，可以通过获取URL参数来获取传递的数据：```javascriptvar urlParams = new URLSearchParams(window.location.search);var data = urlParams.get('data');```2. 使用cookie：使用cookie也是一种传值的常见方式。

通过设置cookie，可以将数据保存在用户的浏览器中，然后在弹出窗口中读取cookie来获取数据。

例如：```javascriptdocument.cookie = "data=Hello World!";window.open('popup.html', 'popup', 'width=500,height=500');```在弹出窗口的页面中，可以通过document.cookie来获取cookie的值：```javascriptvar cookieValue = document.cookie.split('; ').find(row => row.startsWith('data=')).split('=')[1];```3. 使用localStorage：localStorage是一种HTML5提供的本地存储方式，可以将数据保存在用户的浏览器中。

javascript常用代码大全-网页设计HTMLCSS

javas‎c ript‎常用代码‎大全-网页‎设计,HT‎M LCSS‎//打‎开模式对话‎框fu‎n ctio‎n dos‎e lect‎u ser(‎t xtid‎){ ‎‎‎s trfe‎a ture‎s="di‎a logw‎i dth=‎500px‎;dial‎o ghei‎g ht=3‎60px;‎c ente‎r=yes‎;midd‎l e=ye‎s ;he‎l p=n o‎;stat‎u s=no‎;scro‎l l=no‎";‎‎v ar u‎r l,st‎r retu‎r n;‎‎ u‎r l="s‎e luse‎r.asp‎x";‎‎‎‎s trre‎t urn=‎w indo‎w.sho‎w moda‎l dial‎o g(ur‎l,,st‎r feat‎u res)‎;‎}‎//‎返回模式对‎话框的值‎func‎t ion ‎o kbtn‎_oncl‎i ck()‎{‎v ar c‎o mmst‎r=; ‎‎‎‎wind‎o w.re‎t urnv‎a lue=‎c omms‎t r;‎‎ w‎i ndow‎.clos‎e() ;‎}‎全屏幕打开‎ie 窗‎口va‎r win‎w idth‎=scre‎e n.av‎a ilwi‎d th ;‎var‎winh‎e ight‎=scre‎e n.av‎a ilhe‎i ght-‎20;‎w indo‎w.ope‎n("ma‎i n.as‎p x","‎s urve‎y wind‎o w","‎t oolb‎a r=no‎,widt‎h="+ ‎w inwi‎d th ‎+",he‎i ght=‎" + wi‎n heig‎h t +‎",top‎=0,le‎f t=0,‎s crol‎l bars‎=yes,‎r esiz‎a ble=‎y es,c‎e nter‎:yes,‎s tatu‎s bars‎=yes"‎); b‎r eak ‎//脚本‎中中使用x‎m lf‎u ncti‎o n in‎i tial‎i ze()‎{‎var ‎x mldo‎c‎v ar x‎s ldoc‎‎ xml‎d oc =‎new ‎a ctiv‎e xobj‎e ct(m‎i cros‎o ft.x‎m ldom‎)‎x mldo‎c.asy‎n c = ‎f alse‎;‎xs‎l doc ‎= new‎acti‎v exob‎j ect(‎m icro‎s oft.‎x mldo‎m)‎xsld‎o c.as‎y nc =‎fals‎e;‎xm‎l doc.‎l oad(‎"tree‎.xml"‎)‎x sldo‎c.loa‎d("tr‎e e.xs‎l")‎‎fo‎l dert‎r ee.i‎n nerh‎t ml =‎xmld‎o c.do‎c umen‎t elem‎e nt.t‎r ansf‎o rmno‎d e(xs‎l doc)‎}‎一、‎验证类‎1、数字验‎证内‎1.1 ‎整数‎1.2 ‎大于0的整‎数（用于‎传来的id‎的验证) ‎1.‎3负整数‎的验证‎ 1.4‎整数不能‎大于ima‎x‎1.5 整‎数不能小于‎i min ‎2、时间‎类‎2.1 短‎时间，形如‎(13:‎04:06‎)‎2.2 短‎日期，形如‎(200‎3-12-‎05)‎ 2.3‎长时间，‎形如 (2‎003-1‎2-05 ‎13:04‎:06) ‎2.‎4只有年‎和月。

javascript 常用代码大全-网页设计,HTMLCSS

var d= new date(r[1], r[3]-1,r[4],r[5],r[6],r[7]);
return (d.getfullyear()==r[1]&&(d.getmonth()+1)==r[3]&&d.getdate()==r[4]&&d.gethours()==r[5]&&d.getminutes()==r[6]&&d.getseconds()==r[7]);
14，各种<object classid=>相关类，如播放器，flash与脚本互动等
16, 刷新/模拟无刷新异步调用类（xmlhttp或iframe,frame）
一、验证类
1、数字验证内
1.1 整数
/^(-|\+)?\d+$/.test(str)
4.3 判断字符由字母和数字，下划线,点号组成.且开头的只能是下划线和字母
/^([a-za-z_]{1})([\w]*)$/g.test(str)
4.4 字符串替换函数.replace();
5、浏览器类
5.1 判断浏览器的类型
window.navigator.appname
3.2 多行文本框的值不能为空。
3.3 多行文本框的值不能超过smaxstrleng
3.4 多行文本框的值不能少于smixstrleng
3.5 判断单选框是否选择。
3.6 判断复选框是否选择.
3.7 复选框的全选，多选，全不选，反选
3.8 文件上传过程中判断文件类型
{
return(new regexp(/^\w+((-\w+)|(\.\w+))*\@[a-za-z0-9]+((\.|-)[a-za-z0-9]+)*\.[a-za-z0-9]+$/).test(mail));

Javascript弹窗代码大全(收集)

弹窗代码大全(收集)以下包括强制弹窗 24小时IP弹窗延时弹窗退弹等我们使用cookie来控制一下就可以了。

你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。

javascript－－弹出对话框四种对话框获得用户输入值

javascript－－弹出对话框四种对话框获得用户输入值javascript－－弹出对话框四种对话框获得用户输入值让用户点击确定取消。

让用户输入值。

打开指定窗口alert("message") confirm("message") prompt("message") open("url")首先我想先说两句我对javascript的一些看法，我希望大家认真的去学习这门编程语言，因为它给我们在开发网页时，会带来很多的惊喜！javascript一般是运行在客户端的(client)，主要用于开发一些网页中的动态效果，其实它的用处还有很多，比如验证表单内容，以及现在比较流行的ＡＪＡＸ应用．今天主要写一下javascript中的弹出对话框：第一种：alert("message")第二种：confirm("message")第三钟：prompt("message")第四种：open("url")第一种alert对话框是一个最简单，也是最常用的一个弹出对话框，通常用于提示信息，对话框包含一个按钮，单击对话框中的按钮将会关闭此对话框．第二种confirm对话框返回的是一个布尔值，该对话框一般用于用户选择，该对话框包含两个按钮，一般一个是＂确认＂，另一个是＂取消＂,比如我们在开发程序的时候，创建一个删除按钮，为了防止用户务操作，一般就会用到这个对话框：＂您确定删除吗？＂如果选择＂确定＂，执行删除，如果选择＂取消＂，则返回，不做任何操作！第三种prompt对话框，主要用户获取用户输入的信息，比如，弹出一个对话框:<script language="javascript">var name=prompt("你的名字叫什么?");document.write(name);</script>prompt对话框包括两个按钮（＂确认＂和＂取消＂）和一个文本框，文本框用来获取用户输入的信息．第四种其实是一种用对话框的方式打开一个网页,open方法包含很多的参数，主要是用户设置浏览器的显示外观：window.open("Webpage.asp?",Derek,"height=100,width=10 0,status=yes,toolbar=yes,menubar=no,location=no");此语句打开一个新窗口，页面为webpage.asp，参数为var，名字为Derek，高为100，宽为100，显示状态栏和工具条，不显示菜单和地址。

JavaScript写的一个自定义弹出式对话框代码

JavaScript写的⼀个⾃定义弹出式对话框代码下图是我的设计思路下⾯是具体的js代码1，⾸先定义⼏个⾃定义函数代码复制代码代码如下://判断是否为数组function isArray(v){return v && typeof v.length == 'number' && typeof v.splice == 'function';}//创建元素function createEle(tagName){return document.createElement(tagName);}//在body中添加⼦元素function appChild(eleName){return document.body.appendChild(eleName);}//从body中移除⼦元素function remChild(eleName){return document.body.removeChild(eleName);}2，具体的窗体实现代码代码复制代码代码如下://弹出窗⼝，标题（html形式）、html、宽度、⾼度、是否为模式对话框(true,false)、按钮（关闭按钮为默认，格式为['按钮1',fun1,'按钮2',fun2]数组形式，前⾯为按钮值，后⾯为按钮onclick事件）function showWindow(title,html,width,height,modal,buttons){//避免窗体过⼩if (width < 300){width = 300;}if (height < 200){height = 200;}//声明mask的宽度和⾼度（也即整个屏幕的宽度和⾼度）var w,h;//可见区域宽度和⾼度var cw = document.body.clientWidth;var ch = document.body.clientHeight;//正⽂的宽度和⾼度var sw = document.body.scrollWidth;var sh = document.body.scrollHeight;//可见区域顶部距离body顶部和左边距离var st = document.body.scrollTop;var sl = document.body.scrollLeft;w = cw > sw ? cw:sw;h = ch > sh ? ch:sh;//避免窗体过⼤if (width > w){width = w;}if (height > h){height = h;}//如果modal为true，即模式对话框的话，就要创建⼀透明的掩膜if (modal){var mask = createEle('div');mask.style.cssText = "position:absolute;left:0;top:0px;background:#fff;filter:Alpha(Opacity=30);opacity:0.5;z-index:10000;width:" + w + "px;height:" + h + "px;";appChild(mask);}//这是主窗体var win = createEle('div');win.style.cssText = "position:absolute;left:" + (sl + cw/2 - width/2) + "px;top:" + (st + ch/2 - height/2) +"px;background:#f0f0f0;z-index:10001;width:" + width + "px;height:" + height + "px;border:solid 2px #afccfe;"; //标题栏var tBar = createEle('div');//afccfe,dce8ff,2b2f79tBar.style.cssText = "margin:0;width:" + width + "px;height:25px;background:url(top-bottom.png);cursor:move;"; //标题栏中的⽂字部分var titleCon = createEle('div');titleCon.style.cssText = "float:left;margin:3px;";titleCon.innerHTML = title;//firefox不⽀持innerText，所以这⾥⽤innerHTMLtBar.appendChild(titleCon);//标题栏中的“关闭按钮”var closeCon = createEle('div');closeCon.style.cssText = "float:right;width:20px;margin:3px;cursor:pointer;";//cursor:hand在firefox中不可⽤closeCon.innerHTML = "×";tBar.appendChild(closeCon);win.appendChild(tBar);//窗体的内容部分，CSS中的overflow使得当内容⼤⼩超过此范围时，会出现滚动条var htmlCon = createEle('div');htmlCon.style.cssText = "text-align:center;width:" + width + "px;height:" + (height - 50) + "px;overflow:auto;"; htmlCon.innerHTML = html;win.appendChild(htmlCon);//窗体底部的按钮部分var btnCon = createEle('div');btnCon.style.cssText = "width:" + width + "px;height:25px;text-height:20px;background:url(top-bottom.png);text-align:center;padding-top:3px;";//如果参数buttons为数组的话，就会创建⾃定义按钮if (isArray(buttons)){var length = buttons.length;if (length > 0){if (length % 2 == 0){for (var i = 0; i < length; i = i + 2){//按钮数组var btn = createEle('button');btn.innerHTML = buttons[i];//firefox不⽀持value属性，所以这⾥⽤innerHTML// btn.value = buttons[i];btn.onclick = buttons[i + 1];btnCon.appendChild(btn);//⽤户填充按钮之间的空⽩var nbsp = createEle('label');nbsp.innerHTML = "&nbsp&nbsp";btnCon.appendChild(nbsp);}}}}//这是默认的关闭按钮var btn = createEle('button');// btn.setAttribute("value","关闭");btn.innerHTML = '关闭';// btn.value = '关闭';btnCon.appendChild(btn);win.appendChild(btnCon);appChild(win);/*************************************以下为拖动窗体事件*********************///⿏标停留的X坐标var mouseX = 0;//⿏标停留的Y坐标var mouseY = 0;//窗体到body顶部的距离var toTop = 0;//窗体到body左边的距离var toLeft = 0;//判断窗体是否可以移动var moveable = false;//标题栏的按下⿏标事件tBar.onmousedown = function(){var eve = getEvent();moveable = true;mouseX = eve.clientX;mouseY = eve.clientY;toTop = parseInt(win.style.top);toLeft = parseInt(win.style.left);//移动⿏标事件tBar.onmousemove = function(){if(moveable){var eve = getEvent();var x = toLeft + eve.clientX - mouseX;var y = toTop + eve.clientY - mouseY;if (x > 0 && (x + width < w) && y > 0 && (y + height < h)){win.style.left = x + "px";win.style.top = y + "px";}}}//放下⿏标事件，注意这⾥是document⽽不是tBardocument.onmouseup = function(){moveable = false;}}//获取浏览器事件的⽅法，兼容ie和firefoxfunction getEvent(){return window.event || arguments.callee.caller.arguments[0];}//顶部的标题栏和底部的按钮栏中的“关闭按钮”的关闭事件btn.onclick = closeCon.onclick = function(){remChild(win);remChild(mask);}}实例调⽤复制代码代码如下:str = "看看我的窗体效果";showWindow('我的提⽰框',str,850,250,true,['地区',fun1,'矿种',fun2]);更为完整实⽤的代码，包括定义和调⽤代码复制代码代码如下:<html><head><title>⾃定义弹出对话框</title><style type ="text/css" >.layout{width:2000px;height:400px;border:solid 1px red;text-align:center;}</style><script type="text/javascript">//判断是否为数组function isArray(v){return v && typeof v.length == 'number' && typeof v.splice == 'function'; }//创建元素function createEle(tagName){return document.createElement(tagName);}//在body中添加⼦元素function appChild(eleName){return document.body.appendChild(eleName);}//从body中移除⼦元素function remChild(eleName){return document.body.removeChild(eleName);}//弹出窗⼝，标题（html形式）、html、宽度、⾼度、是否为模式对话框(true,false)、按钮（关闭按钮为默认，格式为['按钮1',fun1,'按钮2',fun2]数组形式，前⾯为按钮值，后⾯为按钮onclick事件）function showWindow(title,html,width,height,modal,buttons){//避免窗体过⼩if (width < 300){width = 300;}if (height < 200){height = 200;}//声明mask的宽度和⾼度（也即整个屏幕的宽度和⾼度）var w,h;//可见区域宽度和⾼度var cw = document.body.clientWidth;var ch = document.body.clientHeight;//正⽂的宽度和⾼度var sw = document.body.scrollWidth;var sh = document.body.scrollHeight;//可见区域顶部距离body顶部和左边距离var st = document.body.scrollTop;var sl = document.body.scrollLeft;w = cw > sw ? cw:sw;h = ch > sh ? ch:sh;//避免窗体过⼤if (width > w){width = w;}if (height > h){height = h;}//如果modal为true，即模式对话框的话，就要创建⼀透明的掩膜if (modal){var mask = createEle('div');mask.style.cssText = "position:absolute;left:0;top:0px;background:#fff;filter:Alpha(Opacity=30);opacity:0.5;z-index:100;width:" + w + "px;height:" + h + "px;";appChild(mask);}//这是主窗体var win = createEle('div');win.style.cssText = "position:absolute;left:" + (sl + cw/2 - width/2) + "px;top:" + (st + ch/2 - height/2) +"px;background:#f0f0f0;z-index:101;width:" + width + "px;height:" + height + "px;border:solid 2px #afccfe;";//标题栏var tBar = createEle('div');//afccfe,dce8ff,2b2f79tBar.style.cssText = "margin:0;width:" + width + "px;height:25px;background:url(top-bottom.png);cursor:move;"; //标题栏中的⽂字部分var titleCon = createEle('div');titleCon.style.cssText = "float:left;margin:3px;";titleCon.innerHTML = title;//firefox不⽀持innerText，所以这⾥⽤innerHTMLtBar.appendChild(titleCon);//标题栏中的“关闭按钮”var closeCon = createEle('div');closeCon.style.cssText = "float:right;width:20px;margin:3px;cursor:pointer;";//cursor:hand在firefox中不可⽤closeCon.innerHTML = "×";tBar.appendChild(closeCon);win.appendChild(tBar);//窗体的内容部分，CSS中的overflow使得当内容⼤⼩超过此范围时，会出现滚动条var htmlCon = createEle('div');htmlCon.style.cssText = "text-align:center;width:" + width + "px;height:" + (height - 50) + "px;overflow:auto;"; htmlCon.innerHTML = html;win.appendChild(htmlCon);//窗体底部的按钮部分var btnCon = createEle('div');btnCon.style.cssText = "width:" + width + "px;height:25px;text-height:20px;background:url(top-bottom.png);text-align:center;padding-top:3px;";//如果参数buttons为数组的话，就会创建⾃定义按钮if (isArray(buttons)){var length = buttons.length;if (length > 0){if (length % 2 == 0){for (var i = 0; i < length; i = i + 2){//按钮数组var btn = createEle('button');btn.innerHTML = buttons[i];//firefox不⽀持value属性，所以这⾥⽤innerHTML// btn.value = buttons[i];btn.onclick = buttons[i + 1];btnCon.appendChild(btn);//⽤户填充按钮之间的空⽩var nbsp = createEle('label');nbsp.innerHTML = "&nbsp&nbsp";btnCon.appendChild(nbsp);}}}}//这是默认的关闭按钮var btn = createEle('button');// btn.setAttribute("value","关闭");btn.innerHTML = "关闭";// btn.value = '关闭';btnCon.appendChild(btn);win.appendChild(btnCon);appChild(win);/******************************************************以下为拖动窗体事件************************************************/ //⿏标停留的X坐标var mouseX = 0;//⿏标停留的Y坐标var mouseY = 0;//窗体到body顶部的距离var toTop = 0;//窗体到body左边的距离var toLeft = 0;//判断窗体是否可以移动var moveable = false;//标题栏的按下⿏标事件tBar.onmousedown = function(){var eve = getEvent();moveable = true;mouseX = eve.clientX;mouseY = eve.clientY;toTop = parseInt(win.style.top);toLeft = parseInt(win.style.left); //移动⿏标事件 tBar.onmousemove = function() { if(moveable) { var eve = getEvent(); var x = toLeft + eve.clientX - mouseX; var y = toTop + eve.clientY - mouseY; if (x > 0 && (x + width < w) && y > 0 && (y + height < h)) { win.style.left = x + "px"; win.style.top = y + "px"; } } } //放下⿏标事件，注意这⾥是document⽽不是tBar document.onmouseup = function() { moveable = false; } }//获取浏览器事件的⽅法，兼容ie和firefoxfunction getEvent(){return window.event || arguments.callee.caller.arguments[0];}//顶部的标题栏和底部的按钮栏中的“关闭按钮”的关闭事件btn.onclick = closeCon.onclick = function(){remChild(win);if (mask){remChild(mask);}}}function addCheckbox(name,value,id,click){var str = "<input type='checkbox' name='" + name + "' value='" + value + "' id='" + id + "' onclick='" + (click == null ? '':click) + "'/>&nbsp<label for='" + id + "'>" + value + "</label>";return str;}function show(){var str = "<div><div style='border:dotted 1px blue'><table cellspacing='2'>";str += "<tr><td colspan='7' style='text-align:center'>请选择所在地区：" + addCheckbox('all','全（不）选','cities_all','selectAll(this,\"cities_cb\")') + "</td></tr>";str += "<tr><td>" + addCheckbox('cities_cb','长沙市','cities_cb1') + "</td><td>" + addCheckbox('cities_cb','株洲市','cities_cb2') + "</td><td>" + addCheckbox('cities_cb','湘潭市','cities_cb3') + "</td><td>" + addCheckbox('cities_cb','衡阳市','cities_cb4') + " </td><td>" + addCheckbox('cities_cb','益阳市','cities_cb5') + "</td>";str += "<td>" + addCheckbox('cities_cb','常德市','cities_cb6') + "</td><td>" + addCheckbox('cities_cb','岳阳市','cities_cb7') + "str += "<tr><td>" + addCheckbox('cities_cb','邵阳市','cities_cb8') + "</td><td>" + addCheckbox('cities_cb','郴州市','cities_cb9') + "</td><td>" + addCheckbox('cities_cb','娄底市','cities_cb10') + "</td>";str += "<td>" + addCheckbox('cities_cb','永州市','cities_cb11') + "</td><td>" + addCheckbox('cities_cb','怀化市','cities_cb12') + "</td><td>" + addCheckbox('cities_cb','张家界市','cities_cb13') + "</td><td>" + addCheckbox('cities_cb','湘西⾃治州','cities_cb14') + "</td></tr>";str += "</table></div><br/><div style='border:dotted 1px blue'><table cellspacing='2'>";str += "<tr><td colspan='10' style='text-align:center'>请选择矿种：" + addCheckbox('all','全（不）选','class_all','selectAll(this,\"class_cb\")') + "</td></tr>";str += "<tr><td>" + addCheckbox('class_cb','铋','class_cb1') + "</td><td>" + addCheckbox('class_cb','钒','class_cb2') + "</td> <td>" + addCheckbox('class_cb','⾦','class_cb3') + "</td><td>" + addCheckbox('class_cb','煤','class_cb4') + "</td><td>" + addCheckbox('class_cb','锰','class_cb5') + "</td><td>" + addCheckbox('class_cb','钼','class_cb6') + "</td><td>" + addCheckbox('class_cb','铅','class_cb7') + "</td><td>" + addCheckbox('class_cb','⽯膏','class_cb8') + "</td><td>" + addCheckbox('class_cb','⽯煤','class_cb9') + "</td><td>" + addCheckbox('class_cb','锑','class_cb10') + "</td></tr>";str += "<tr><td>" + addCheckbox('class_cb','铁','class_cb11') + "</td><td>" + addCheckbox('class_cb','铜','class_cb12') + "</td><td>" + addCheckbox('class_cb','钨','class_cb13') + "</td><td>" + addCheckbox('class_cb','锡','class_cb14') + "</td><td>" + addCheckbox('class_cb','锌','class_cb15') + "</td><td>" + addCheckbox('class_cb','银','class_cb16') + "</td><td>" + addCheckbox('class_cb','萤⽯','class_cb17') + "</td><td>" + addCheckbox('class_cb','铀','class_cb18') + "</td><td>" + addCheckbox('class_cb','稀⼟氧化物','class_cb19') + "</td><td>" + addCheckbox('class_cb','重晶⽯','class_cb20') + "</td> </tr>";str += "<tr><td>" + addCheckbox('class_cb','硼','class_cb21') + "</td><td>" + addCheckbox('class_cb','磷','class_cb22') + "</td><td>" + addCheckbox('class_cb','⽔泥灰岩','class_cb23') + "</td><td>" + addCheckbox('class_cb','熔剂灰岩','class_cb24') + "</td><td>" + addCheckbox('class_cb','冶⾦⽩云岩','class_cb25') + "</td><td>" +addCheckbox('class_cb','岩盐','class_cb26') + "</td><td>" + addCheckbox('class_cb','芒硝','class_cb27') + "</td><td>" + addCheckbox('class_cb','钙芒硝','class_cb28') + "</td><td>" + addCheckbox('class_cb','地下⽔','class_cb29') + "</td><td>" + addCheckbox('class_cb','地下热⽔','class_cb30') + "</td></tr>";str += "</table></div></div>";showWindow('我的提⽰框',str,850,250,true,['地区',fun1,'矿种',fun2]);}function selectAll(obj,oName){var checkboxs = document.getElementsByName(oName);for(var i=0;i<checkboxs.length;i++){checkboxs[i].checked = obj.checked;}}function getStr(cbName){var cbox = document.getElementsByName(cbName);var str = "";for (var i=0;i<cbox.length;i++){if(cbox[i].checked){str += "," + cbox[i].value;}}str = str.substr(1);return str;}function fun1(){var str = getStr('cities_cb');alert('你选择的地区为：' + str);}function fun2(){var str = getStr('class_cb');alert('你选择的矿种为：' + str);}</script><body><div class ="layout"></div><div class ="layout"></div><div class ="layout"><input type="button" value="显⽰" onclick="show()" /> </div></body></html>此脚本在ie，firefox浏览器下运⾏通过。

用JS制作9种弹出小窗口

用JS制作9种弹出小窗口使用JavaScript可以实现各种类型的弹出小窗口，以下将介绍九种常见的实现方式。

1. `alert`函数弹窗：这是JavaScript中最简单的弹窗函数，通过在脚本中调用`alert("文本内容")`可以在页面中弹出一个带有文本内容的小窗口。

2. `confirm`函数弹窗：通过调用`confirm("文本内容")`函数可以在页面中弹出一个带有文本内容和确定/取消按钮的小窗口。

用户可以选择确定或取消。

3. `prompt`函数弹窗：通过调用`prompt("文本内容","默认值")`函数可以在页面中弹出一个带有文本内容、输入框和确定/取消按钮的小窗口。

用户可以输入内容后点击确定或取消。

4. 自定义样式的弹窗：通过CSS和JavaScript可以自定义弹窗的样式。

可以通过创建一个包含弹窗内部结构的HTML元素，使用CSS设置其样式，然后通过JavaScript控制其显示和隐藏。

5. 第三方插件：也可以使用一些第三方插件或库来实现弹窗功能，例如jQuery UI中的对话框组件、SweetAlert等等。

这些插件通常提供了更多样式和功能选项，可以根据需求来选择。

6. 使用DOM模态框：使用HTML5中的`<dialog>`元素可以创建一个模态框（类似对话框），通过JavaScript可以控制其显示和隐藏。

7. 使用Bootstrap模态框：Bootstrap是一个流行的前端框架，它提供了一个用于创建模态框的组件。

通过引入Bootstrap的样式文件和相关JavaScript文件，可以使用`<div class="modal">`元素创建模态框。

8. 自定义jQuery模态框：使用jQuery可以方便地创建自定义的模态框。

可以通过HTML和CSS创建一个基本的模态框结构，然后使用jQuery控制其显示和隐藏。

JavaScript实现弹出广告功能

JavaScript实现弹出⼴告功能
废话不多说了，直接给⼤家贴代码了，具体代码如下所⽰：
<span style="white-space:pre"> </span>var i=0;//记录次数
var timer;//定时器id
//设置弹出⼴告
onload=function(){
//间隔四秒展⽰⼀次⼴告
timer = setInterval(showAd,4000);
}
//展⽰2秒以后隐藏⼴告的⽅法
function showAd(){
i++;//展⽰的次数加1
//若i等于3清空由setInterval设置的定时器
if(i==3){
clearInterval(timer);
}
//1.获取⼴告
var divObj = document.getElementById("ad");
//2，修改⼴告的样式
divObj.style.display="block";
//两秒之后隐藏
setTimeout(hiddAd,2000);
}
//隐藏⼴告
function hiddAd(){
var divObj = document.getElementById("ad");
divObj.style.display="none";
}
以上所述是⼩编给⼤家介绍的JavaScript实现弹出⼴告功能，希望对⼤家有所帮助，如果⼤家有任何疑问请给我留⾔，⼩编会及时回复⼤家的。

在此也⾮常感谢⼤家对⽹站的⽀持！。

JavaScript弹出对话框的三种方式

执行上面的小例子，在页面上弹出对话框并显示一句话“上联：山石岩下古木枯”，如下所示：接着，单击“确认”按钮后再显示第二个对话框并显示“白水泉边少女妙！”，效果如下；在页面上弹出对话框并显示一句话“上联：山石岩下古木枯”，单击“确认”按钮后再显示第2个对话框并显示“白水泉边少女妙！”我们来分析一下这个小例子：a、在<script>脚本块中两次调用alert()方法；b、在每个alert()括号内分别添加了一段文本信息，运行出现如下图所示的页面，当使用鼠标单击页面上的“确定”按钮后，出现第二个页面，再点击“确定”按钮后就关闭页面上的对话框。

注意：两个对话框是分别显示的，而不是一个覆盖另一个，这是因为js实在执行完第一个alert()并等到用户点击“确认”按钮之后才去执行第二个alert()的。

alert()是js的window对象的一个方法，调用时可以写成window.alert()，也可以写成alert ()，功能都是产生一个带确认按钮的对话框，上面显示括号内的信息，第二种：confirm()方法confirm()方法与alert()方法的使用十分类似，不同点是在该种对话框上除了包含一个“确认”按钮外，还有一个“取消”按钮，这种对话框称为确认对话框，在调用window对象的confir显示效果如下：分析一下这个小例子：a、在<script>脚本块中添加confirm()方法、b、在confirm()括号内添加了一段文本信息，运行效果如上图所示，如果用户单击“确认”按钮，则confirm()方法会返回true，如果用户单击“取消”按钮，则confirm()方法会返回false，无论用户选择哪个按钮，都会关闭对话框，而继续执行javascript代码。

单击“确认”或“取消”如果单击页面的确认框上的“确定”按钮后，出现如下图所示的页面：如果单击“取消”按钮，则出现如下图所示的页面：第三种：prompt()方法alert()方法和confirm()方法的使用十分类似，都是仅仅显示已有的信息，但用户不能输入自己的信息，但是prompt()可以做到这点，她不但可以显示信息，而且还提供了一个文本框要求用户使用键盘输入自己的信息，同时她还包含“确认”或“取消”两个按钮，如果用户“确认”按钮，则prompt()方法返回用户在文本框中输入的内容（是字符串类型)或者初始值(如果用户没有输入信息);如果用户单击“取消”按钮，则prompt()方法返回null，我们称这种对话框为提示框，在这三种对话框中，她的交互性最好。

JS弹出对话框实现方法（三种方式）

JS弹出对话框实现⽅法（三种⽅式）本⽂实例讲述了JS弹出对话框实现⽅法。

分享给⼤家供⼤家参考，具体如下：1.警告框<html><head><script type="text/javascript">function disp_alert(){alert("我是警告框！！")}</script></head><body><input type="button" onclick="disp_alert()" value="显⽰警告框" /></body></html>2.确定取消框<html><head><script type="text/javascript">function disp_confirm(){var r=confirm("按下按钮")if (r==true){document.write("您按了确认！")}else{document.write("您按了取消！")}}</script></head><body><input type="button" onclick="disp_confirm()" value="显⽰确认框" /></body></html>3.有输⼊的框<html><head><script type="text/javascript">function disp_prompt(){var name=prompt("请输⼊您的名字","Bill Gates")if (name!=null && name!=""){document.write("你好！" + name + " 今天过得怎么样？")}}</script></head><body><input type="button" onclick="disp_prompt()" value="显⽰提⽰框" /></body></html>希望本⽂所述对⼤家JavaScript程序设计有所帮助。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。