JavaScript中常用的三种弹窗

这篇具有很好参考价值的文章主要介绍了JavaScript中常用的三种弹窗。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目录

一、alert(警告框)

二、confirm(确认框)

三、prompt (提示框) 


 JavaScript 中可以创建三种消息框:警告框、确认框、提示框。

一、alert(警告框)

        alert()方法是显示一条弹出提示消息和确认按钮的警告框。
需要注意的是 :

        alert()是一个阻塞的函数,如果我们不点确认按钮,后面的内容就不会加载出来。

代码演示:

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

二、confirm(确认框)

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

代码演示:

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

三、prompt (提示框) 

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

代码演示:

<!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>

 文章来源地址https://www.toymoban.com/news/detail-537021.html

到了这里,关于JavaScript中常用的三种弹窗的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • JavaScript的三种引用方式

    1.1、标签引用(或嵌入式) 使用 script 标签将 JavaScript 代码嵌入到 HTML 页面中。可以放置在 head 或 body 中。 显示效果: 1.2、 文件引用 (外链式) 将 JavaScript 代码编写在一个独立的 .js 文件中,并通过 script 标签的 src 属性引入到 HTML 页面中。 显示效果: 1.3、行内式 直接在

    2024年02月02日
    浏览(49)
  • JavaScript删除字符串最后一个字符的三种方法

    JavaScript删除字符串最后一个字符的三种方法 在JavaScript中,我们经常需要操作字符串。有时候,我们可能需要删除字符串的最后一个字符。下面将介绍三种常见的方法来实现这个目标。 方法一:使用 slice 函数 slice 函数是JavaScript中一个常用的字符串方法,它可以返回一个新的

    2024年02月08日
    浏览(57)
  • JavaScript 中问号的三种用法 ??和?.以及?: 您知道吗?

     最近看了一些关于JavaScript的测试脚本,觉得JS 中问号的用法还是蛮有意思的,于是做了一下总结,在这里分享给大家!JS中的问号大概有三种用法,分别是:空值合并操作符、可选链操作符和三目运算。 空值合并操作符??是一个逻辑操作符,当左侧的操作数为 null 或者 und

    2024年02月11日
    浏览(32)
  • rsync常用的三种用法

    用法1:本地用法 类似于cp、dd命令,实现备份文件的复制(备份) # rsync /etc/passwd /home/passwd.bak # rsync -b --suffix=.bak2 --backup-dir=/tmp/ /etc/passwd /home/passwd.bak --suffix=xxx        指定旧备份文件的后缀名 --backup-dir=xxxx   指定将旧备份文件移动到哪个位置下 1 2 3 4 用法2:远程shell 利用

    2024年01月17日
    浏览(37)
  • mysql常用的三种备份方法

    mysql按照备份恢复方式分为逻辑备份和物理备份 逻辑备份是备份sql语句,在恢复的时候执行备份的sql语句实现数据库数据的重现 物理备份就是备份数据文件了,比较形象点就是cp下数据文件,但真正备份的时候自然不是的cp这么简单 这2种备份各有优劣,一般来说,物理备份恢

    2024年02月12日
    浏览(59)
  • Docker——常用挂载的三种方式

    在 Docker 中,有三种常见的挂载方式,它们分别是: 绑定挂载(Bind Mounts) :绑定挂载是将主机上的文件或目录挂载到容器中。这种挂载方式允许容器与主机之间共享文件和目录,并且对其中一个的更改会直接影响到另一个。可以通过在运行容器时使用  -v  或  --mount  参数

    2024年02月12日
    浏览(57)
  • unity常用的三种拖拽方法

    在2d图片与3d场景中使用OnMouseDrag()的方法实现拖拽,而对于ui没有作用。 通过添加Event Tringger组件实现,按下Add New Event Type添加新的事件类型,下拉菜单中显示不同的事件类型,包括鼠标进入离开按下松开点击拖拽等,以及拖拽结束后的EndDrag事件。他看上去和Button组件中的o

    2024年02月04日
    浏览(57)
  • JS绑定事件的三种方法(简单易懂)

    相信大家都了解过事件,但如何给元素绑定事件,如何使用呢? 让我为大家介绍三种绑定事件的方法吧! 以下都是用点击事件(click)来做示范 代码总结: 本人文笔有限,如有不对的地方,可以向我提出,感谢大家!

    2024年02月03日
    浏览(59)
  • js返回上一页的三种方法分享

    最常用的一种方法,可以返回、前进任意一步的页面、回到上一页 1 2 3 4 5 6 // 回到上一页 window.history.go(-1); // 回到下一页 window.history.go(1); // 回到任意一页 widnow.history.go(+前进几页) back() 方法可加载历史列表中的前一个 URL(如果存在)。 调用该方法的效果等价于点击后退按

    2024年02月12日
    浏览(46)
  • JS实现轮播图的三种简单方法。

    实现思路 这可能是轮播图最简单点的实现之一,通过更改图片的src来实现该效果,首先需要将图片命名格式统一比如pic01.jpg,pic02.jpg…,再通过js使用定时器去改变img标签里面的src图片链接的名字来实现切换效果。代码如下: 实现效果 实现思路 这可能是轮播图最简单点的实现

    2024年02月03日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包