SweetAlert插件

SweetAlert是一个JS插件，能够完美替代JS自带的alert弹出框，并且功能强大，设计优美。

• 引入文件

<link href="${ctx }/libs/sweetalert/sweetalert.css" rel="stylesheet" type="text/css">

<script src="${ctx }/libs/sweetalert/sweetalert.min.js" type="text/javascript"></script>

• JS代码

      buttons: {
        "提交": function() {
        //使用sweetAlert插件
        swal({
        title:"您确定要提交吗",
                       text:"提交后将无法恢复，请谨慎操作！",
                       type:"warning",
                       showCancelButton:true,
                       confirmButtonText:"提交",
                       cancelButtonText:"取消",
                       closeOnConfirm:false,
                       closeOnCancel:false
               },
                   function(isConfirm){
                       if(isConfirm){
                           swal({
                            title:"提交成功！",
                               text:"您已经成功提交。",
                               type:"success"
                           },
                                function(){
                                //两种提交方式都可以
                                //document.forms[0].submit();
                                document.getElementById('inputForm').submit();
                                $("#dialog-form").dialog( "close" );
                           });
                       }else{
                           swal({
                            title:"已取消",
                               text:"您取消了本次操作！",
                               type:"error"
                          },
                          function(){
                          $("#dialog-form").dialog( "close" );
                          });
                       }
                   });
                //不能写在这里，可能表单还没提交操作，就已经关闭了
                //$("#dialog-form").dialog( "close" );
       },
       "取消": function() {
          $(this).dialog("close");
       }

效果如下

提交操作

取消操作

参考地址

http://blog.****.net/Ayhan_huang/article/details/77365576

http://www.cnblogs.com/beiz/p/5238124.html