• css_自定义提示框


    1.描述

    用的bootstrap框架,但是整体风格跟bootstrap风格相差很大,需要自己定义一个提示框。

    2.代码

    css:

        .succAlert {
                display: none;
                position: absolute;
                top: 50%;
                left: 35%;
                 20%;
                height: 5%;
                 35%;
                padding: 5px;
                text-align: center;
                font-size: 16px;
                color: green;
                background-color: rgb(242,242,242);
                font-weight: bold;
            }
            .errorAlert {
                display: none;
                position: absolute;
                top: 50%;
                left: 35%;
                 20%;
                height: 5%;
                 35%;
                padding: 5px;
                text-align: center;
                font-size: 16px;
                color: crimson;
                background-color: rgb(242,242,242);
                font-weight: bold;
            }
    

    javascript:

            $.ajax({
                    type: "POST",//方法类型
                    contentType:'application/json',
                    dataType: "json",//预期服务器返回的数据类型
                    url: "http://localhost:8080/saveRBD",//url
                    data: JSON.stringify(list),
                    success: function (data) {
                        console.log("成功");
                        mySuccAlert("保存成功!");
                    },
                    error: function (result) {
                        console.log("失败");
                        myErrorAlert("添加失败,请稍后重试!");
                    }
                });    
           function mySuccAlert(str) {
                var div = '<div class="succAlert"></div>';
                $('body').append(div)
                $('.succAlert').html(str);
                $('.succAlert').show();
                setTimeout(function() {
                    $('.succAlert').hide();
                    $('.succAlert').remove();
                }, 2000)
            }
            function myErrorAlert(str) {
                var div = '<div class="errorAlert"></div>';
                $('body').append(div)
                $('.errorAlert').html(str);
                $('.errorAlert').show();
                setTimeout(function() {
                    $('.errorAlert').hide();
                    $('.errorAlert').remove();
                }, 2000)
            }
    

    3.结果

    其实感觉也没有好看到哪去。。。

  • 相关阅读:
    Rabbitmq 不同系统 间 调用
    《 工作呀工作 之 excel 上传 》
    List 中删除 元素
    springboot jpa 的使用 二
    java中级面试题 之linux 与数据库
    java中级面试题 之基础篇
    git 操作
    eclipse 安装lombok插件
    瑞士轮
    Piggy-Bank
  • 原文地址:https://www.cnblogs.com/smxbo/p/13160514.html
Copyright © 2020-2023  润新知