toastr 自定义提示

时间:2021-05-11 18:37:36

在线实例

实例演示

使用方法

  1. <button type="button" class="btn btn-primary" id="showtoast">显示</button>
复制
  1. toastr.info('我只是一个提示信息')
复制

参数说明

  1. $(function(){
  2. //参数设置,若用默认值可以省略以下面代
  3. toastr.options = {
  4. "closeButton": false, //是否显示关闭按钮
  5. "debug": false, //是否使用debug模式
  6. "positionClass": "toast-top-full-width",//弹出窗的位置
  7. "showDuration": "300",//显示的动画时间
  8. "hideDuration": "1000",//消失的动画时间
  9. "timeOut": "5000", //展现时间
  10. "extendedTimeOut": "1000",//加长展示时间
  11. "showEasing": "swing",//显示时的动画缓冲方式
  12. "hideEasing": "linear",//消失时的动画缓冲方式
  13. "showMethod": "fadeIn",//显示时的动画方式
  14. "hideMethod": "fadeOut" //消失时的动画方式
  15. };
  16. //成功提示绑定
  17. $("#success").click(function(){
  18. toastr.success("祝贺你成功了");
  19. })
  20. //信息提示绑定
  21. $("#info").click(function(){
  22. toastr.info("这是一个提示信息");
  23. })
  24. //敬告提示绑定
  25. $("#warning").click(function(){
  26. toastr.warning("警告你别来烦我了");
  27. })
  28. //错语提示绑定
  29. $("#error").click(function(){
  30. toastr.error("出现错误,请更改");
  31. })
  32. //清除窗口绑定
  33. $("#clear").click(function(){
  34. toastr.clear();
  35. })
  36. })
复制