Web App 开发----对话框

最新推荐文章于 2022-12-14 10:59:09 发布

烊烊！

最新推荐文章于 2022-12-14 10:59:09 发布

阅读量994

点赞数

文章标签： web app

本文链接：https://blog.csdn.net/m0_58760840/article/details/123784852

版权

本文详细介绍了Web App中四种类型的对话框：警告消息框、确认消息框、输入对话框和自动消失提示框。通过代码示例展示了如何创建这些对话框，并解释了用户交互后的响应方式，如返回按钮索引值或输入值。

摘要由CSDN通过智能技术生成

对话框

创建并显示对话框，弹出的对话框为非阻塞模式，用户点击对话框上的按钮后关闭，并通过callback函数返回用户点击按钮的索引值或输入框中的值。

组件名	作用
alert	警告框
confirm	确认框
prompt	输入对话框
toast	消息提示框

参数	说明	说明
duration	持续显示时间,默认值 `short`(2000ms)	支持整数值和 String , String可选: `long`(3500ms),`short`(2000ms)
type	强制使用mui消息框(div模式)	`'div'`

1.警告消息框

<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<style>
			.mui-btn {
				display: block;
				width: 150px;
				margin: 10px auto;

			}
		</style>
	</head>
	<body>
		<div class="mui-content-padded" style="margin: 10px; text-align: center;">
			<button id="alertBtn" type="button" class="mui-btn mui-btn-blue mui-btn-outlined">警告消息框</bu