jquery SweetAlert swal()弹出层插件实现响应式提示框

什么是sweetalert，SweetAlert 是一个 JavaScript 插件，能够完美替代 JavaScript 自带的 alert 弹出框，并且功能强大、设计优美。swal()方法是一个提示框，是SweetAlert框架下面的方法。

使用方法

swal({ 
  title: "", 
  text: "请扫描用户手机上的付款码",
  type: "input", 
  showCancelButton: true, 
  closeOnConfirm: false, 
  cancelButtonText: "取消", 
  confirmButtonText: "确认", 
  imageUrl: "/assets/images/icon/scancode.gif",
  inputPlaceholder: "请填写付款码数字",
  showLoaderOnConfirm: true
},function(inputValue){ 
  if(inputValue){
    if (inputValue === "") { 
      swal.showInputError("请填写付款码数字");
      return false 
    }else{
      $("input[name=‘authCode‘]").val(inputValue);
      var form = cashierFrom.serialize();
      $.post("/cashier/order", form, function(data) {
        var result = $.parseJSON(data);
        if (result.code == ‘SUCCESS‘) {
          swal({
            title : "支付成功",
            type : "success",
            confirmButtonText : "确定",
            closeOnConfirm : false
          });
        } else {
          if(result.subCode==‘USER_PAYING‘){
            var html = ‘<div class="q-btn-box"><button type="button" class="btn btn-primary waves-effect waves-light">取消</button></div>‘;
            showLoadAlert(‘等待用户输入密码..‘,html);
            var no = result.outTradeNo;
            queryInterval = self.setInterval("cashierOrderQuery(‘" no "‘,true)",3000);
          }else{
            swal({
              title : "支付失败",
              type : "error",
              text : result.msg,
              confirmButtonText : "确定",
              closeOnConfirm : false
            });
          }
        }
      });
    }
  }
});

swal() 增加确认及取消的方法

swal({
  title: "确认删除?",
  text: "Your will not be able to recover this imaginary file!",
  type: "warning",
  showCancelButton: true,
  confirmButtonColor: "#DD6B55",
  confirmButtonText: "确认",
  cancelButtonText: "取消",
  closeOnConfirm: false,
  closeOnCancel: false
},
function(isConfirm){
  if (isConfirm) {
    swal("Deleted!", "Your imaginary file has been deleted.", "success");
  } else {
    swal("Cancelled", "Your imaginary file is safe :)", "error");
  }
});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

若资源对你有帮助，浏览后有很大收获，不妨小额打赏我一下，你的鼓励是维持我不断写博客最大动力。

想获取DD博客最新代码，你可以扫描下方的二维码，关注DD博客微信公众号（ddblogs）。

或者你也可以关注我的新浪微博，了解DD博客的最新动态：DD博客官方微博（dwtedx的微博）。

如对资源有任何疑问或觉得仍然有很大的改善空间，可以对该博文进行评论，希望不吝赐教。

为保证及时回复，可以使用博客留言板给我留言: DD博客留言板（dwtedx的留言板）。

感谢你的访问，祝你生活愉快、工作顺心、欢迎常来逛逛。