html对话框alert,confirm,prompt用法汇总

2 篇文章 0 订阅
1 篇文章 0 订阅

html页面简单的三种对话框如下:

1、alert(),最简单的提示框:

alert("你好!");  

2、confirm(),有确认和取消两个按钮:

if(confirm("还有继续吗?")){  
    alert("继续");  
}else{  
    alert("再见");  
}  

3、prompt(),可以输入信息:

var name = prompt("你的名字是:");  
alert("你好," + name);  

完整的html代码:

<!DOCTYPE html>  
<html>  
  <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <meta name="content-type" content="text/html; charset=UTF-8">  

    <title>对话框测试</title>  

    <script>  
        function confirmDialog(){  
            if(confirm("还要继续吗?")){  
                alert("继续");  
            }else{  
                alert("再见");  
            }  
        }  

        function promptDialog(){  
            var name = prompt("你的名字是:");  
            alert("你好," + name);  
        }  
    </script>  
  </head>  

<body>  
对话框测试:  
    <div style="margin-top:50px">  
        <input type="button" value="alert" onclick="alert('你好!')" />  
        <input type="button" value="confirm" onclick="confirmDialog()" />  
        <input type="button" value="prompt" onclick="promptDialog()" />  
    </div>  
</body>  
</html>  

来自
http://blog.csdn.net/clementad/article/details/46763139


我们在访问网站的时候,有时会突然弹出一个小窗口,上面写着一段提示信息文字。如果你不点击“确定”,就不能对网页做任何操作,这个小窗口就是使用alert实现的。

注:alert弹出消息对话框(包含一个确定按钮)。

语法:

alert(字符串或变量);
注意:

  1. 在点击对话框”确定”按钮前,不能进行任何其它操作。

  2. 消息对话框通常可以用于调试程序。

  3. alert输出内容,可以是字符串或变量,与document.write 相似。

<title>alert</title>  
  <script type="text/javascript">  
  function rec(){  
    var mychar="I love JavaScript";  
    alert(mychar);  
  }  
  </script>  
</head>  
<body>  
    <input name="button" type="button" onClick="rec()" value="点击我,弹出对话框" />  
</body>  

确认(confirm 消息对话框)
confirm 消息对话框通常用于允许用户做选择的动作,如:“你对吗?”等。弹出对话框(包括一个确定按钮和一个取消按钮)。
语法:

confirm(str);
参数说明:

str:在消息对话框中要显示的文本
返回值: Boolean值
返回值:

当用户点击”确定”按钮时,返回true
当用户点击”取消”按钮时,返回false
注: 通过返回值可以判断用户点击了什么按钮

<script type="text/javascript">  

function rec()  
{  
    var mymessage=confirm("你喜欢javascript吗?");  
    if(mymessage==true)  
    {  
        document.write("很好,加油!");  
    }  
    else if(mymessage==false)  
    {  
        document.write("要学javascript,而且必须学");  
    }  
}  
</script>  

</head>  

<body>  
    <input type="button" name="button" value="点击我,弹出确认对话框" onclick="rec()" />  
</body>  
<script type="text/javascript">  
function resc()  
{  
    var myname=prompt("请输入你的姓名");  
    if(myname!=null)  
    {  
        document.write("你好"+myname);  
    }  
    else  
    {  
        document.write("你好"+朋友);  
    }  
}  
</script>  
<body>  
    <input type="button" name="button" value="点击我,弹出提问对话框" onclick="resc()" />  
</body>  
  • 8
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值