js弹出确认对话框confirm(),alert(),prompt

window.alert() 使用警告、提示和确

 代码如下 复制代码

<html>
<head>
<script type="text/javascript">
function message()
{
alert("该提示框是通过 onload 事件调用的。")
}
</script>
</head>

<body onload="message()">

</body>
</html>

confirm 方法的返回值为 true 或 false

 代码如下 复制代码

<script language="JavaScript">            
function delete_confirm(e)
{
    if (event.srcElement.outerText == "删除")
    {
        event.returnValue = confirm("删除是不可恢复的,你确认要删除吗?");
    }
}
document.onclick = delete_confirm;
</script>

<a href="Delete.aspx" onClick="delete_confirm">删除</a>

例2

if(window.confirm('你确定要取消交易吗?')){
                 //alert("确定");
                 return true;
              }else{
                 //alert("取消");
                 return false;
    }

 

prompt 方法也将显示一个模式消息框。用户在继续操作之前必须先关闭该消息框

var theResponse = window.prompt("欢迎?","请在此输入您的姓名。");

例1

 代码如下 复制代码

<script language="javascript" type="text/javascript">
function prom(href)
{
var name=prompt("input the name","");

if(name=="admin")
{
var pwsd=prompt("input the password","");
if(pwsd=="admin")
{
alert("login ok...");
location.href=href;
}
else{alert("error password");}
}
else{alert("error name");}
}
</script>

<html type="button" onClick="prom();" name="prom" value="prom">

上面的都是用js自己原,下面我们利用js写一个div+js弹出提示框,这种也是现在常用的

 代码如下 复制代码

/*
 js弹窗代码:用户体验极佳的Alert提示效果
 pubdate:2011-05-26 10:15
 e-mail:xpsem2010@gmail.com
 source:小拼SEM博客
*/
//获取指定ID的元素
function $xp(id) {
 return document.getElementById(id);
}
//通用事件获取接口
function getEvent()
{
 if(CheckBrowser()=='IE')  return window.event;
 func=getEvent.caller;
 while(func!=null)
 {
  var arg0 = func.arguments[0];
  if(arg0)
  {
   if((arg0.constructor==Event || arg0.constructor ==MouseEvent)
   || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
   {
    return arg0;
   }
  }
  func=func.caller;
 }
 return null;
}
//alert
function NewAlertBox(msg, time){//time为消失时间
 var msgbg,msgcolor,bordercolor,content,posLeft,posTop;
 //弹出窗口设置
 msgbg = "#FFF";   //内容背景
 msgcolor = "#000";  //内容颜色
 bordercolor = "#ccc";  //边框颜色
 //遮罩背景设置
 content = "这里是表情图片地址(HTML格式)" + msg;
 var sWidth,sHeight;
 sWidth = screen.availWidth - 20;//防止溢出
 if(screen.availHeight > document.body.scrollHeight){
  sHeight = screen.availHeight; //少于一屏
 }else{
  sHeight = document.body.scrollHeight; //多于一屏
 }
 //创建遮罩背景
 var maskObj = document.createElement("div");
 maskObj.setAttribute('id','maskdiv');
 maskObj.style.position = "absolute";
 maskObj.style.top = "0";
 maskObj.style.left = "0";
 maskObj.style.background = "#fff";
 maskObj.style.filter = "Alpha(opacity=40);";
 maskObj.style.opacity = "0.4";
 maskObj.style.width = sWidth + "px";
 maskObj.style.height = sHeight + "px";
 maskObj.style.zIndex = "10000";
 document.body.appendChild(maskObj);
 //创建弹出窗口
 var msgObj = document.createElement("div")
 msgObj.setAttribute("id","msgdiv");
 msgObj.style.position ="absolute";
 var event = getEvent();//申明event
 if(CheckBrowser()=='IE')
 {
  posLeft = event.clientX + 10;
  posTop = event.clientY + document.documentElement.scrollTop;
 }
 else
 {
  posLeft = event.pageX + 10 + "px";//ff下要申明px
  posTop = event.pageY + 10 + "px";
 }
 msgObj.style.top = posTop;
 msgObj.style.left = posLeft;
 msgObj.style.fontSize = "12px";
 msgObj.style.background = msgbg;
 msgObj.style.border = "1px solid " + bordercolor;
 msgObj.style.zIndex = "10001";
 //创建内容
 var bodyObj = document.createElement("div");
 bodyObj.setAttribute("id","msgbody");
 bodyObj.style.padding = "10px";
 bodyObj.style.lineHeight = "1.5em";
 //var txt = document.createTextNode(content);
 //bodyObj.appendChild(txt);
 bodyObj.innerHTML = content;
 //生成窗口
 document.body.appendChild(msgObj);
 $xp("msgdiv").appendChild(bodyObj);
 if(time != '') setTimeout("CloseMsg()",time);
 else setTimeout("CloseMsg()",2000);//默认两秒后自动消失
 return false;
}
//移除对象
function CloseMsg(){
 document.body.removeChild($xp("maskdiv"));
 $xp("msgdiv").removeChild($xp("msgbody"));
 document.body.removeChild($xp("msgdiv"));
}
//判断浏览器类型
function CheckBrowser(){
    var cb = "Unknown";
    if(window.ActiveXObject){
        cb = "IE";
    }else if(navigator.userAgent.toLowerCase().indexOf("firefox") != -1){
        cb = "Firefox";
    }else if((typeof document.implementation != "undefined") && (typeof document.implementation.createDocument != "undefined") && (typeof HTMLDocument != "undefined")){
        cb = "Mozilla";
    }else if(navigator.userAgent.toLowerCase().indexOf("opera") != -1){
        cb = "Opera";
    }
    return cb;
}

调用方法

onClick="NewAlertBox('测试Alert提示效果',3000);"

时间: 2024-07-29 03:22:08

js弹出确认对话框confirm(),alert(),prompt的相关文章

js弹出确认是否删除对话框

 这篇文章主要介绍了js弹出确认是否删除对话框,具体实现代码如下,需要的朋友可以参考下  代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml"

教你做一个可以弹出确认对话框的自定义Web服务器控件ConfirmButton

web|web服务|web服务器|对话框|控件 经常在论坛里看到类似这样的问题:"-如何在点击删除按钮的时候弹出个确认删除对话框". 下面我们来自己写一个这样的自定义Web服务器控件! 思路如下: 继承System.Web.UI.WebControls.Button控件 增加一个属性"ConfirmMessage"来表示弹出确认框上面的提示信息. 在服务器控件呈现在页面之前把一段javascript写到页面 内容如下: <script language=&qu

可以弹出确认对话框的自定义Web服务器控件ConfirmButton

经常在论坛里看到类似这样的问题:"-如何在点击删除按钮的时候弹出个确认删除对话框".      下面我们来自己写一个这样的自定义Web服务器控件!      思路如下:      继承System.Web.UI.WebControls.Button控件      增加一个属性"ConfirmMessage"来表示弹出确认框上面的提示信息.      在服务器控件呈现在页面之前把一段javascript写到页面      内容如下:      <script l

js弹出模式对话框,并接收回传值的方法_javascript技巧

弹出对话框的页面A: 复制代码 代码如下: <script type="text/javascript">    function openDialog(){        paramers="dialogWidth:500px; dialogHeight:300px; status:no";        workerId = window.showModalDialog("userList.aspx","",p

js弹出确认是否删除对话框_javascript技巧

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

ASP.NET实例: GridView删除时弹出确认对话框

效果图:   html代码 <table align="center" bgcolor="#c0de98" border="0" cellpadding="0" cellspacing="1" width="99%"> <tr> <th colspan="2"> GridView演示</th> </tr> &

Javascript模仿弹出确认对话框

 这样的一个通用窗口.. 代码如下 construct(){ setting={ ID:'window ID', TitleText:'', Content:'content Text', // Parent:null, //窗口的父句柄 默认是加到 body里 boxCss:'class03_tank ', TitleCss:'class03_tank_top', //标题CSS ContentCss:'padtb10', //内容CSS width:280, height:'auto', b

js 弹出提示对话框

提示:您可以先修改部分代码再运行 111222 www.111cn.net 提示:您可以先修改部分代码再运行

jquery插件jquery.confirm弹出确认消息_javascript技巧

本文为大家介绍了插件jquery.confirm弹出确认消息的实现方法,具有一定的参考价值,特分享给大家供大家参考,具体内容如下 实现效果: 具体代码: 1.插件默认参数 // 默认参数 $.confirm.defaults = { // 样式 css: "http://static.qianduanblog.com/css/jquery.confirm/default.min.css?v=" + Math.ceil(new Date() / 86400000), // 确认框内容 c