JS弹窗的三种方式

最新推荐文章于 2024-05-09 15:49:59 发布

荒--

最新推荐文章于 2024-05-09 15:49:59 发布

阅读量2.6w

点赞数 4

分类专栏： WEB基础

本文链接：https://blog.csdn.net/wangqing84411433/article/details/70208276

版权

WEB基础专栏收录该内容

30 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html>
  <head>
    <title>JS弹窗的三种方式</title>
    <meta charset="utf-8"/>
    <script type="text/javascript">
      //第一种
      function f1(){
    	alert("这是第一种弹窗alert,单击确定后才能进行下一步的操作,只是提醒,不能对脚本产生任何改变");
      }
      //第二种
      function f2(){
    	var flag = confirm("这是第二种弹窗confirm单击确定返回true,单击取消返回false");
    	if(flag){
    	  alert("你点击的是确定");
    	}else{
    	  alert("你单击的是取消");	
    	}
      }
      //第三种
      function f3(){
    	//将输入的内容赋给变量name
    	var name = prompt("请输入你的名字:","");
    	//这里需要注意的是,prompt有两个参数,前面是提示的话,后面是当对话框出来后,在对话框里的默认值
    	//若点击取消按钮,则返回值为null,类型为object
    	//若点击确认按钮,则返回值为输入的字符串(不输入时为空字符串),类型为string
    	console.log(name);
    	console.log(typeof(name));
    	if("王庆" === name){
          alert("欢迎您:"+name);
    	}else{
    	  alert("输入有误!");
    	}
      }
    </script>
  </head>
  <body>
    <button οnclick="f1();">alert</button>
    <button οnclick="f2();">confirm</button>
    <button οnclick="f3();">prompt</button>
  </body>
</html

荒--

关注

4
点赞
踩
26

收藏

觉得还不错? 一键收藏
打赏
2
评论
JS弹窗的三种方式

JS弹窗的三种方式 //第一种 function f1(){ alert("这是第一种弹窗alert,单击确定后才能进行下一步的操作,只是提醒,不能对脚本产生任何改变"); } //第二种 function f2(){ var flag = confirm("这是第二种弹窗confirm单击确定返回
复制链接

扫一扫