用promise写一个对话框

最新推荐文章于 2023-11-13 20:21:04 发布

燕子斜6912

最新推荐文章于 2023-11-13 20:21:04 发布

阅读量283

点赞数

分类专栏： promise 对话框文章标签： javascript 前端

本文链接：https://blog.csdn.net/s_wollow/article/details/105319168

版权

这篇博客探讨了如何利用Promise来实现一个简单的前端对话框。通过点击创建按钮，对话框会弹出，提供关闭、失败和成功选项。选择关闭或失败则对话框关闭，而点击成功则触发相应操作并关闭对话框。

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

没有做过多的样式的修饰。只是对近期研究promise的做出来的。

操作流程：点击创建按钮——>显示对话框——>关闭和失败按钮——>对话框关闭；

点击创建按钮——>显示对话框——>成功按钮——>做对应的操作——>对话框关闭；

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        *{
            padding: 0;margin:0;}
        .dialog{
            position: absolute;
            width:100%;
            height: 100%;left:0;top:0;
            background: rgba(0,0,0,.4);
        }
        button{padding:5px 12px;}
        #closedbutton{
            float: right;font-size:12px;padding:4px 8px;
            color: #000;}
    </styl