准备
首先我们要将SweetAlert插件的js文件和css文件导入到页面中。
本文组合的示例中使用了jQuery库，因此还必须导入jQuery库文件。
基本使用
在页面上需要调用弹出提示框的元素上绑定一句话，比如点击按钮弹出：
$("button").click(function(){
swal("这是一个信息提示框!");
});
确认提示
当我们进行删除等危险操作时，删除前会弹出确认提示框，就像javascript的confirm()函数一样。 点击确认按钮后html 确认框，才会进行下一步真正的删除操作。
$("button").click(function(){
swal({
title: "您确定要删除吗？",
text: "您确定要删除这条数据？",
type: "warning",
showCancelButton: true,
closeOnConfirm: false,
confirmButtonText: "是的，我要删除",
confirmButtonColor: "#ec6c62"
}, function() {
$.ajax({
url: "do.php",
type: "DELETE"
}).done(function(data) {
swal("操作成功!", "已成功删除数据！", "success");
}).error(function(data) {
swal("OMG", "删除操作失败了!", "error");
});
});
});
上述示例代码实现了一个确认删除数据的过程。 点击按钮后html 确认框，会弹出提示框，要求用户确认。 如果点击确认，则会向后台do.php发送ajax请求，然后do.php会执行相应的数据删除操作，删除后将数据返回到后台页面。 ，js根据返回的数据提示用户操作结果信息。 单击此处查看演示。
选项设置
SweetAlert插件提供了很多选项设置，可以通过自定义很多属性参数等信息来满足项目开发的需要。
title：提示框的标题。
text：提示内容。
type：提示类型，包括：success（成功）、error（错误）、warning（警告）、input（输入）。
showCancelButton：是否显示“取消”按钮。
动画：弹出提示框时的动画效果，如slide-from-top（从底部向下滑动）等。
html：是否支持html内容。
timer：设置手动关闭提示框的时间（以毫秒为单位）。
showConfirmButton：是否显示确认按钮。
informButtonText：定义确认按钮的文本内容。
imageUrl：定义弹出框中图像的URL。
有关 SweetAlert 插件的更多信息可以在项目网站上找到： 。
