js弹出框、对话框、提示框、弹窗总结

一、JS的三种最常见的对话框

//====================== JS最常用三种弹出对话框 ========================  
  
    //弹出对话框并输出一段提示信息  
    function ale() {  
        //弹出一个对话框  
        alert("提示信息!");  
  
    }  
  
    //弹出一个询问框,有确定和取消按钮  
    function firm() {  
        //利用对话框返回的值 (true 或者 false)  
        if (confirm("你确定提交吗?")) {  
            alert("点击了确定");  
        }  
        else {  
            alert("点击了取消");  
        }  
  
    }  
  
    //弹出一个输入框,输入一段文字,可以提交  
    function prom() {  
        var name = prompt("请输入您的名字", ""); //将输入的内容赋给变量 name ,  
  
        //这里需要注意的是,prompt有两个参数,前面是提示的话,后面是当对话框出来后,在对话框里的默认值  
        if (name)//如果返回的有内容  
        {  
            alert("欢迎您:" + name)  
        }  
  
    }  

二、点击按钮时常用的6中提示框和操作

<marquee scrollAmount=2 width=300>欢迎来到魔人牛牛新浪博客!</marquee>
   <!-----------按钮提示框----------> 
   <input type="button" name="btn2" id="btn2" value="删除" οnclick="return confirm('Yes/No');">
   <!-----------按钮提示框----------> 
   <input type="button" name="btn2" id="btn2" value="提示" οnclick="javaScript:alert('您确定要删除吗?');">
   
   <!-----------提交按钮---------->   
   <input type="button" value="提交" οnclick="javaScript:window.location.href='http://www.baidu.com';"/>
   
   <!-----------关闭按钮---------->   
   <input type="button" value="关闭" οnclick="javaScript:window.close();">  
   
   <!-----------返回并关闭连接---------->   
	<a href="#" οnclick="javascript:window.opener.location.reload();window.close();">返回</a>  
	<!-- javaScript:window.location.reload();//返回当前页并刷新 -->
	
	<!-----------返回上一级页面---------->   
    <input type="button" name="button" value="返回上一级页面" οnclick="javascript:history.go(-1)"/>
三、弹出独立窗口
//关闭,父窗口弹出对话框,子窗口直接关闭   
this.Response.Write("<script language=javascript>window.close();</script>");  
  
//关闭,父窗口和子窗口都不弹出对话框,直接关闭   
this.Response.Write("<script>");   
this.Response.Write("{top.opener =null;top.close();}");   
this.Response.Write("</script>");  
  
//弹出窗口刷新当前页面width=200 height=200菜单。菜单栏,工具条,地址栏,状态栏全没有   
this.Response.Write("<script language=javascript>window.open('rows.aspx','newwindow','width=200,height=200')</script>");  
  
//弹出窗口刷新当前页面   
this.Response.Write("<script language=javascript>window.open('rows.aspx')</script>");  
this.Response.Write("<script>window.open('WebForm2.aspx','_blank');</script>");  
  
//弹出提示窗口跳到webform2.aspx页(在一个IE窗口中)   
this.Response.Write(" <script language=javascript>alert('注册成功');window.window.location.href='WebForm2.aspx';</script> ");  
  
//关闭当前子窗口,刷新父窗口   
this.Response.Write("<script>window.opener.location.href=window.opener.location.href;window.close();</script>");  
this.Response.Write("<script>window.opener.location.replace(window.opener.document.referrer);window.close();</script>");  
  
//子窗口刷新父窗口   
this.Response.Write("<script>window.opener.location.href=window.opener.location.href;</script>");  
this.Response.Write("<script>window.opener.location.href='WebForm1.aspx';</script>");  
  
//弹出提示窗口.确定后弹出子窗口(WebForm2.aspx)   
this.Response.Write("<script language='javascript'>alert('发表成功!');window.open('WebForm2.aspx')</script>");  
  
//弹出提示窗口,确定后,刷新父窗口   
this.Response.Write("<script>alert('发表成功!');window.opener.location.href=window.opener.location.href;</script>");  
  
//弹出相同的一页   
<INPUT type="button" value="Button" οnclick="javascript:window.open(window.location.href)">  
  
//   
Response.Write("parent.mainFrameBottom.location.href='yourwebform.aspx?temp=" +str+"';");  
  
  
<SCRIPT LANGUAGE="javascript">   
<!--   
window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no') //这句要写成一行  
-->   

转载:http://blog.csdn.net/anhuidelinger/article/details/17024491



  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
组件名称:ymPrompt消息提示组件 2.0 演示地址:http://bbs.okajax.com/demo/31/ =============================================================================== 组件说明:在web开发中,对于浏览器默认的消息提示框(如alert,confirm等)外观无法控制,为了实现更好的界面效果,于是模拟系统的消息提示框实现了该组件。在外观上可以通过css进行完全的控制。 =============================================================================== 组件功能介绍: 1、调用方式简单,直接使用ymPrompt.alert()的方式调用,传入相应的参数即可。 2、兼容IE6.0+、FF1.5+、Opear9+(在Opear下显示有一个小缺陷),兼容HTML4/XHTML1.0页面渲染模式。 3、完全的CSS皮肤定制功能,所有外观包括显示图标/关闭按钮等都可以通过css设置。目前提供了五种皮肤,Vista、QQ、dmm-green、ExtBlue和BlackColl。有兴趣可以修改样式表文件定义新的皮肤。 4、提供四种消息类型。分别为消息提示、成功信息、错误信息、询问信息。 5、弹出消息时屏蔽页面其它元素的操作,自动隐藏页面select及iframe下select(无限级select隐藏),并遮罩iframe等元素。 6、页面select控件状态还原时保持原状态,即如果原来select就是隐藏的,则消息弹出并关闭后该select仍保持隐藏状态,而只显示原本显示的select。 7、消息组件弹出时屏蔽除Tab和回车外的几乎所有键盘操作(包括F5),“消息确认”支持“tab键/左右方向键”切换确定/取消焦点。 8、可以页面加载的任意时间调用,如页面初始化时调用,页面加载完成后调用。 9、支持通过JSON和传统的参数传入方式。如ymprompt.alert('消息内容',300,200,'消息标题',handler)和ymprompt.alert({message:'消息内容',width:300,height:200,title:'消息标题',handler:handler}),这两种写法是等价的。 10、只需要一个回调函数,可捕获确定、取消及关键按钮的点击事件。函数改变了1.0版需要对确定和取消按钮分别写回调函数及不支持关闭事件的缺陷, 11、完全的封装,对外只暴露一个ymPrompt变量,有效防止与使用者程序变量的冲突。 12、程序(js)与样式(css)的完全分离,取消了1.0中自动加载css的功能,用户可根据需要加载对应css样式表单,降低了对样式配置的复杂度。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值