SwwetAlert消息提示插件,支持手机移动响应式替换alert漂亮的消息提示插件

前端开发 作者: 2024-08-25 17:25:01
SwwetAlert支持手机移动响应式消息提示插件官方地址:http://tristanedwards.me/sweetalert IE11有闪退IE11无闪退 地址:http://www.js-css.cn/jscode/tips/tips13/语法参考 swal("Good job!", "Y

SwwetAlert

  • 官方地址:http://tristanedwards.me/sweetalert IE11有闪退
  • IE11无闪退 地址:http://www.js-css.cn/jscode/tips/tips13/

swal("Good job!","You clicked the button!","success")

IE11无闪退JS (sweet-alert.min.js)

!function (e,t) { function n() { var e = '<div class="sweet-overlay" tabIndex="⑴"></div><div class="sweet-alert" tabIndex="⑴"><div class="icon error"><span class="x-mark"><span class="line left"></span><span class="line right"></span></span></div><div class="icon warning"> <span class="body"></span> <span class="dot"></span> </div> <div class="icon info"></div> <div class="icon success"> <span class="line tip"></span> <span class="line long"></span> <div class="placeholder"></div> <div class="fix"></div> </div> <div class="icon custom"></div> <h2>Title</h2><p>Text</p><button class="cancel" tabIndex="2">Cancel</button><button class="confirm" tabIndex="1">OK</button></div>',n = t.createElement("div"); n.innerHTML = e,t.body.appendChild(n) } function o(t) { var n = y(),o = n.querySelector("h2"),r = n.querySelector("p"),a = n.querySelector("button.cancel"),c = n.querySelector("button.confirm"); if (o.innerHTML = b(t.title).split(" ").join("<br>"),r.innerHTML = b(t.text || "").split(" ").join("<br>"),t.text && w(r),x(n.querySelectorAll(".icon")),t.type) { for (var l = !1,s = 0; s < f.length; s++) if (t.type === f[s]) { l = !0; break } if (!l) return e.console.error("Unknown alert type: " + t.type),!1; var u = n.querySelector(".icon." + t.type); switch (w(u),t.type) { case "success": g(u,"animate"),g(u.querySelector(".tip"),"animateSuccessTip"),g(u.querySelector(".long"),"animateSuccessLong"); break; case "error": g(u,"animateErrorIcon"),g(u.querySelector(".x-mark"),"animateXMark"); break; case "warning": g(u,"pulseWarning"),g(u.querySelector(".body"),"pulseWarningIns"),g(u.querySelector(".dot"),"pulseWarningIns") } } if (t.imageUrl) { var d = n.querySelector(".icon.custom"); d.style.backgroundImage = "url(" + t.imageUrl + ")",w(d); var p = 80,m = 80; if (t.imageSize) { var v = t.imageSize.split("x")[0],h = t.imageSize.split("x")[1]; v && h ? (p = v,m = h,d.css({ width: v + "px",height: h + "px" })) : e.console.error("Parameter imageSize expects value with format WIDTHxHEIGHT,got " + t.imageSize) } d.setAttribute("style",d.getAttribute("style") + "width:" + p + "px; height:" + m + "px") } n.setAttribute("data-has-cancel-button",t.showCancelButton),t.showCancelButton ? a.style.display = "inline-block" : x(a),t.cancelButtonText && (a.innerHTML = b(t.cancelButtonText)),t.confirmButtonText && (c.innerHTML = b(t.confirmButtonText)),c.style.backgroundColor = t.confirmButtonColor,i(c,t.confirmButtonColor),n.setAttribute("data-allow-ouside-click",t.allowOutsideClick); var S = t.doneFunction ? !0 : !1; n.setAttribute("data-has-done-function",S) } function r(e,t) { e = String(e).replace(/[^0⑼a-f]/gi,""),e.length < 6 && (e = e[0] + e[0] + e[1] + e[1] + e[2] + e[2]),t = t || 0; var n = "#",o,r; for (r = 0; 3 > r; r++) o = parseInt(e.substr(2 * r,2),16),o = Math.round(Math.min(Math.max(0,o + o * t),255)).toString(16),n += ("00" + o).substr(o.length); return n } function a(e) { var t = /^#?([a-fd]{2})([a-fd]{2})([a-fd]{2})$/i.exec(e); return t ? parseInt(t[1],16) + "," + parseInt(t[2]," + parseInt(t[3],16) : null } function i(e,t) { var n = a(t); e.style.boxShadow = "0 0 2px rgba(" + n + ",0.8),inset 0 0 0 1px rgba(0,0.05)" } function c() { var e = y(); B(p(),10),w(e),g(e,"showSweetAlert"),v(e,"hideSweetAlert"),I = t.activeElement; var n = e.querySelector("button.confirm"); n.focus(),setTimeout(function () { g(e,"visible") },500) } function l() { var n = y(); T(p(),5),T(n,v(n,g(n,"visible"); var o = n.querySelector(".icon.success"); v(o,v(o.querySelector(".tip"),v(o.querySelector(".long"),"animateSuccessLong"); var r = n.querySelector(".icon.error"); v(r,v(r.querySelector(".x-mark"),"animateXMark"); var a = n.querySelector(".icon.warning"); v(a,v(a.querySelector(".body"),v(a.querySelector(".dot"),e.onkeydown = M,t.onclick = A,I && I.focus(),L = void 0 } function s() { var e = y(); e.style.marginTop = C(y()) } var u = ".sweet-alert",d = ".sweet-overlay",f = ["error","warning","info","success"],y = function () { return t.querySelector(u) },p = function () { return t.querySelector(d) },m = function (e,t) { return new RegExp(" " + t + " ").test(" " + e.className + " ") },g = function (e,t) { m(e,t) || (e.className += " " + t) },v = function (e,t) { var n = " " + e.className.replace(/[ ]/g," ") + " "; if (m(e,t)) { for (; n.indexOf(" " + t + " ") >= 0;) n = n.replace(" " + t + " "," "); e.className = n.replace(/^s+|s+$/g,"") } },b = function (e) { var n = t.createElement("div"); return n.appendChild(t.createTextNode(e)),n.innerHTML },h = function (e) { e.style.opacity = "",e.style.display = "block" },w = function (e) { if (e && !e.length) return h(e); for (var t = 0; t < e.length; ++t) h(e[t]) },S = function (e) { e.style.opacity = "",e.style.display = "none" },x = function (e) { if (e && !e.length) return S(e); for (var t = 0; t < e.length; ++t) S(e[t]) },k = function (e,t) { for (var n = t.parentNode; null !== n;) { if (n === e) return !0; n = n.parentNode } return !1 },C = function (e) { e.style.left = "⑼999px",e.style.display = "block"; var t = e.clientHeight,n = parseInt(getComputedStyle(e).getPropertyValue("padding"),10); return e.style.left = "",e.style.display = "none","-" + parseInt(t / 2 + n) + "px" },B = function (e,t) { t = t || 16,e.style.opacity = 0,e.style.display = "block"; var n = +new Date,o = function () { e.style.opacity = +e.style.opacity + (new Date - n) / 100,n = +new Date,+e.style.opacity < 1 && setTimeout(o,t) }; o() },T = function (e,e.style.opacity = 1; var n = +new Date,o = function () { e.style.opacity = +e.style.opacity - (new Date - n) / 100,+e.style.opacity > 0 ? setTimeout(o,t) : e.style.display = "none" }; o() },E = function (n) { if (MouseEvent) { var o = new MouseEvent("click",{ view: e,bubbles: !1,cancelable: !0 }); n.dispatchEvent(o) } else if (t.createEvent) { var r = t.createEvent("MouseEvents"); r.initEvent("click",!1,!1),n.dispatchEvent(r) } else t.createEventObject ? n.fireEvent("onclick") : "function" == typeof n.onclick && n.onclick() },q = function (t) { "function" == typeof t.stopPropagation ? (t.stopPropagation(),t.preventDefault()) : e.event && e.event.hasOwnProperty("cancelBubble") && (e.event.cancelBubble = !0) },I,A,M,L; e.sweetAlert = e.swal = function () { function n(e) { var t = e.keyCode || e.which; if (-1 !== [9,13,32,27].indexOf(t)) { for (var n = e.target || e.srcElement,o = -1,r = 0; r < h.length; r++) if (n === h[r]) { o = r; break } 9 === t ? (n = -1 === o ? v : o === h.length - 1 ? h[0] : h[o + 1],q(e),n.focus(),i(n,u.confirmButtonColor)) : (n = 13 === t || 32 === t ? -1 === o ? v : void 0 : 27 !== t || b.hidden || "none" === b.style.display ? void 0 : b,void 0 !== n && E(n,e)) } } function a(e) { var t = e.target || e.srcElement,n = e.relatedTarget,o = m(d,"visible"); if (o) { var r = -1; if (null !== n) { for (var a = 0; a < h.length; a++) if (n === h[a]) { r = a; break } -1 === r && t.focus() } else L = t } } var u = { title: "",text: "",type: null,allowOutsideClick: !1,showCancelButton: !1,confirmButtonText: "OK",confirmButtonColor: "#AEDEF4",cancelButtonText: "Cancel",imageUrl: null,imageSize: null }; if (void 0 === arguments[0]) return e.console.error("sweetAlert expects at least 1 attribute!"),!1; switch (typeof arguments[0]) { case "string": u.title = arguments[0],u.text = arguments[1] || "",u.type = arguments[2] || ""; break; case "object": if (void 0 === arguments[0].title) return e.console.error('Missing "title" argument!'),!1; u.title = arguments[0].title,u.text = arguments[0].text || u.text,u.type = arguments[0].type || u.type,u.allowOutsideClick = arguments[0].allowOutsideClick || u.allowOutsideClick,u.showCancelButton = arguments[0].showCancelButton || u.showCancelButton,u.confirmButtonText = u.showCancelButton ? "Confirm" : u.confirmButtonText,u.confirmButtonText = arguments[0].confirmButtonText || u.confirmButtonText,u.confirmButtonColor = arguments[0].confirmButtonColor || u.confirmButtonColor,u.cancelButtonText = arguments[0].cancelButtonText || u.cancelButtonText,u.imageUrl = arguments[0].imageUrl || u.imageUrl,u.imageSize = arguments[0].imageSize || u.imageSize,u.doneFunction = arguments[1] || null; break; default: return e.console.error('Unexpected type of argument! Expected "string" or "object",got ' + typeof arguments[0]),!1 } o(u),s(),c(); for (var d = y(),f = function (e) { var t = e.target || e.srcElement,n = "confirm" === t.className,"visible"),a = u.doneFunction && "true" === d.getAttribute("data-has-done-function"); switch (e.type) { case "mouSEOver": n && (e.target.style.backgroundColor = r(u.confirmButtonColor,-.04)); break; case "mouSEOut": n && (e.target.style.backgroundColor = u.confirmButtonColor); break; case "mousedown": n && (e.target.style.backgroundColor = r(u.confirmButtonColor,-.14)); break; case "mouseup": n && (e.target.style.backgroundColor = r(u.confirmButtonColor,-.04)); break; case "focus": var i = d.querySelector("button.confirm"),c = d.querySelector("button.cancel"); n ? c.style.boxShadow = "none" : i.style.boxShadow = "none"; break; case "click": n && a && o && u.doneFunction(),l() } },p = d.querySelectorAll("button"),g = 0; g < p.length; g++) p[g].onclick = f,p[g].onmouSEOver = f,p[g].onmouSEOut = f,p[g].onmousedown = f,p[g].onfocus = f; A = t.onclick,t.onclick = function (e) { var t = e.target || e.srcElement,n = d === t,o = k(d,e.target),r = m(d,a = "true" === d.getAttribute("data-allow-ouside-click"); !n && !o && r && a && l() }; var v = d.querySelector("button.confirm"),b = d.querySelector("button.cancel"),h = d.querySelectorAll("button:not([type=hidden])"); M = e.onkeydown,e.onkeydown = n,v.onblur = a,b.onblur = a,e.onfocus = function () { e.setTimeout(function () { void 0 !== L && (L.focus(),L = void 0) },0) } },function () { "complete" === t.readyState || "interactive" === t.readyState ? n() : t.addEventListener ? t.addEventListener("DOMContentLoaded",function e() { t.removeEventListener("DOMContentLoaded",arguments.callee,n() },!1) : t.attachEvent && t.attachEvent("onreadystatechange",function () { "complete" === t.readyState && (t.detachEvent("onreadystatechange",arguments.callee),n()) }) }() }(window,document);
  1. 目前,官网代码对IE11存在闪退问题
    1. 可将不闪退js代码替换官网插件的js代码
原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
本文链接:http://www.jiecseo.com/news/show_68511.html