漂亮实用的提示框SweetAlert插件

SweetAlert可以替代Javascript原生的alert和confirm等函数呈现的弹出提示框，它将提示框进行了美化，并且允许自定义。

SweetAlert插件提供了很多选项设置，可以通过自定义很多属性参数等信息来满足项目开发需求。 title：提示框标题。 text：提示内容。 type：提示类型，有：success（成功），error（错误），warning（警告），input（输入）。 showCancelButton：是否显示“取消”按钮。 animation：提示框弹出时的动画效果，如slide-from-top（从顶部滑下）等。

插件安装

首先我们必须将SweetAlert插件的js文件和css文件引入到页面中。

<link rel="stylesheet" href="css/sweetalert.css">
<script src="js/sweetalert.min.js"></script>

使用方法

$("#btn1").click(function(){ 
    swal("Here's a message!"); 
}); 

另外支持设置提示类型、带图标的提示框、确认取消提示框，如同javascript的confirm()函数、点击后回调函数、自动关闭提示框、AJAX操作等点击这里看演示。

参数说明

• title：提示框标题
• text：提示内容
• type：提示类型，有：success（成功），error（错误），warning（警告），input（输入）
• showCancelButton：是否显示“取消”按钮
• animation：提示框弹出时的动画效果，如slide-from-top（从顶部滑下）等
• html：是否支持html内容
• timer：设置自动关闭提示框时间（毫秒）
• showConfirmButton：是否显示确定按钮
• confirmButtonText：定义确定按钮文本内容
• imageUrl：定义弹出框中的图片地址