亮眼的弹出框--SweetAlert2

    SweetAlert2是一款功能强大的纯Js模态消息对话框插件。SweetAlert2用于替代浏览器默认的弹出对话框，它提供各种参数和方法，支持嵌入图片，背景，HTML标签等，并提供5种内置的情景类，功能非常强大。

    SweetAlert2是SweetAlert-js的升级版本，它解决了SweetAlert-js中不能嵌入HTML标签的问题，并对弹出对话框进行了优化，同时提供对各种表单元素的支持，还增加了5种情景模式的模态对话框。

    使用SweetAlert2对话框，需要在页面中引入SweetAlert.min的css文件和js文件。最基本的使用方法是通过swal()来弹出一个对话框。

    对话框种类多种多样，适合各个场景的使用。

    我们还可以设置他的属性，让它显示为你希望的样子。下面介绍几个常用的参数。

    title：默认null，是动态弹出框的标题。

    text：默认null，是动态弹出框的描述。

    type：默认null，可以选择弹出框的类型，就是上面的那几种，会对应显示出选择的图标，还用动画效果。

    allowEscapeKey：默认true，使用时通过按键退出动态弹框。

    showCancelButton：默认false，如果设置为true，会显示一个“取消”按钮，点击可以关闭动态弹框。

    confirmButtonColor：“确定”按钮的颜色。

    cancelButtonColor：“取消”按钮的颜色。

    confirmButtonText：默认“OK”，确定按钮上的文本。

    cancelButtonText：默认“Cancel”，取消按钮上的文本。

    timer：默认null，动态弹出框的自动关闭定时器，单位为毫秒。

    代码展示出现选择的动态弹出框：

    

swal({
title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then(function () {
  swal(
    'Deleted!',
    'Your file has been deleted.',
    'success'
  )
})

    图像效果：