【Web前端】JavaScript三种弹出框库调用

需要调用的文件

1. https://www.zhaoxuze.com/template/default/css/toastr.css

2. https://www.zhaoxuze.com/template/default/js/jquery.min.js

3. https://www.zhaoxuze.com/template/default/js/jquery.pjax.js

4. https://www.zhaoxuze.com/template/default/js/toastr.js

效果图：

使用方法：复制一下代码至页面中，将第一步需要调用的四个文件放入head头部调用，然后在javacript中调用即可。

<div id="pjax-container">
    <script>
    $(function () {
    toastr.options = {
    "closeButton": true,
    "debug": false,
    "newestOnTop": false,
    "progressBar": true,
    "rtl": false,
    "positionClass": "toast-top-right",
    "preventDuplicates": false,
    "onclick": null,
    "showDuration": 300,
    "hideDuration": 1000,
    "timeOut": 5000,
    "extendedTimeOut": 1000,
    "showEasing": "swing",
    "hideEasing": "linear",
    "showMethod": "fadeIn",
    "hideMethod": "fadeOut"
    };
    })
    </script>
</div>

调用提示框代码实例：

<script>
    if (满足判断条件) {
        toastr["success"]("获取成功！", "极简黑白");
    } else if (满足判断条件) {
        toastr["warning"]("获取失败！", "极简黑白");
    } else {
        oastr["error"]("获取错误！", "极简黑白");
    }
</script>