JavaScript的三种弹出提示框(alert、confirm、prompt)

JavaScript的三种弹出提示框(alert、confirm、prompt)三种提示框 alert confirm prompt alert alert 方法是显示一条弹出提示消息和确认按钮的警告框 需要注意的是 alert 是一个阻塞的函数 如果我们不点确认按钮 后面的内容就不会加载出来 使用方式 alert 想要提示的文本内容 样例代码 DOCTYPE tml html head metacharset utf 8 script a script metacharset utf 8 head html

三种提示框

alert ()

alert()方法是显示一条弹出提示消息和确认按钮的警告框。
需要注意的是 :alert()是一个阻塞的函数,如果我们不点确认按钮,后面的内容就不会加载出来。

使用方式:

alert("想要提示的文本内容") 

样例代码:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> alert("这是弹出框提示文本") </script> <title></title> </head> <body> <p>alert是阻塞的函数</p> <p>这句话只有在确认弹出框的提示文本后才会显示</p> </body> </html> 

效果截图:

在这里插入图片描述

confirm()

confirm()方法是显示一个含有指定消息和确认和取消按钮的确认框。
如果点击”确定”返回true,否则返回false。

使用方式:
不接收返回值:

confirm("这样写可以直接显示,不接收返回值。") 

接收返回值:

var x; var r=confirm("请按下按钮!"); if (r==true){ x="你按下的是\"确定\"按钮。"; } else{ x="你按下的是\"取消\"按钮。"; } document.write(x) 

样例代码:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> // 使用方式一 confirm("这样写可以直接显示,不接收返回值。") // 使用方式二 var x; var r=confirm("请按下按钮!"); if (r==true){ 
     x="你按下的是\"确定\"按钮。"; } else{ 
     x="你按下的是\"取消\"按钮。"; } document.write(x) </script> <title></title> </head> <body> </body> </html> 

效果截图:
在这里插入图片描述

prompt ()

prompt()方法是显示提示用户进行输入的对话框。
这个方法返回的是用户输入的字符串。

使用方式:

不显示默认文本:

prompt("开心吗?"); // 这个显示内容也可以不写,但就没有交互的意义了。 

显示默认文本:

var x; var name=prompt("请输入你的名字","Keafmd"); if (name!=null && person!=""){ x="你好! " + name + "。"; document.write(x) } 

样例代码:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> //方式一 prompt("开心吗?"); // 这个显示内容也可以不写,但就没有交互的意义了。 //方式二 var x; var name=prompt("请输入你的名字","Keafmd"); //显示默认文本 "Keafmd" if (name!=null && name!=""){ 
     x="你好! " + name + "。"; document.write(x) } </script> <title></title> </head> <body> </body> </html> 

效果截图:
在这里插入图片描述
写作不易,读完如果对你有帮助,感谢点赞支持!
如果你是电脑端,看见右下角的“一键三连”了吗,没错点它[哈哈]

在这里插入图片描述


加油!

共同努力!

Keafmd

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/232562.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 完全背包问题(详细解答)

    完全背包问题(详细解答)首先完全背包问题需要01背包问题做铺垫,如果读者01背包问题没有解决,一定要理解之后,在看完全背包问题,包括01背包的优化!这里是01背包这里是01背包的全部优化好,我们开始完全背包!完全背包定义有N种物品和一个容量为V的背包,每种物品都有无限件可用。第i种物品的体积是v[i],价值是val[i]。求解将哪些物品装入背包可使这些物品的费用总和不超过背包容量,且价值总和最大。从定义中可以看出,与01背包的区别01背包最多只能拿一件物品,完全背包则不然,只要空间够多,一种物品我可以拿n件!01

    2022年6月15日
    31
  • 基于51单片机的红绿灯设计

    基于51单片机的红绿灯设计寒假项目最后一个,基于STC/AT89C51的红路灯设计实现十效果具体为:南北通行42秒,南北闪烁3秒,南北黄灯4秒,禁止通行1秒,东西黄灯4秒,东西通行27秒,东西闪烁3秒,东西黄灯4秒。同时具备特殊放行模式:南北自由通行;东西自由通行;全部禁行。所有时间可以修改。貌似和平时的红路灯不一样,但是由于想凑齐八个状态,就整了这神奇的控制步骤。黄灯多,安全第一!!原理图:本来是想设计一个蓝牙或者……

    2025年5月24日
    5
  • 微型计算机原理与接口技术第六版周荷琴课后答案_微机原理与接口技术第五版周荷琴

    微型计算机原理与接口技术第六版周荷琴课后答案_微机原理与接口技术第五版周荷琴微型计算机原理与接口技术第六版课后答案【内容简介】本书是为中国科学技术大学工科电子类专业本科生学习“微型计算机原理与系统”课程而编写的教材。微型计算机原理与接口技术第六版周荷琴答案从初版开始至每次修订再版,都是作者在参考国内外大量文献、资料的基础之上,吸取各家之长,并结合教学团队多年教学和应用研究的经验,精心组织编写而成的,可谓自成一体。全书内容丰富,图文并茂,讲述深入浅出,通俗易懂,并附有大量的实例和习题,部分习题还给出了解题提示,既可用作教材,也适合于自学,先后被列入“普通高等教育*规划教材”和“

    2022年9月28日
    3
  • SVM SMO算法代码详细剖析

    SVM SMO算法代码详细剖析算法实现一:本文要结合SVM理论部分来看即笔者另一篇https://blog.csdn.net/weixin_42001089/article/details/83276714二:有了理论部分下面就是直接代码啦,本文用四部分进行介绍:最简版的SMO,改进版plattSMO,核函数,sklearn库的SVM,四部分以%%%%%%%分开,采取的顺序是先给代码及结果,然后分析三:这里代码大…

    2022年6月17日
    36
  • 跳过谷歌验证码_如何获取游戏验证码

    跳过谷歌验证码_如何获取游戏验证码本月底,谷歌Google即将停止全球图片验证码服务,这个困扰我们多年的验证码终于要退出历史的舞台了。官方宣告可以看以下截图:想必验证码的发展史已经众所周知了,从2002年到如今,经过了16年的发展,

    2022年8月1日
    10
  • 简述MVC三层架构[通俗易懂]

    简述MVC三层架构[通俗易懂]MVC三层架构什么是MVC:ModelviewController模型、视图、控制器1、早些年用户直接访问控制层,控制层就可以直接操作数据库;servlet–CRUD–>数据库弊端:程序十分臃肿,不利于维护servlet的代码中:处理请求、响应、视图跳转、处理JDBC、处理业务代码、处理逻辑代码架构:没有什么是加一层解决不了的!程序猿调用|JDBC|MysqlOracleSqlServer….2、MVC三层架构Model

    2022年6月25日
    30

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号