手机移动端confirm替换方案
//弹框 ;(function () { var ConfirmBox = function (options){ this.defaults = { title:"", topT:"提示", btnOk:"确定", btnNo:"取消", btnConfirm:"", callback:null }, this.options = $.extend({}, this.defaults, options); }; ConfirmBox.prototype = { constructor: ConfirmBox, boxOpen:function(){ var teml = ""; teml=teml+'<div id="opp">'; teml=teml+'<div class="opBox js-opBox">'; teml=teml+' <div class="opBoxHead"><i class="icon f16">x</i> '+this.options.topT+'</div>'; teml=teml+' <div class="opBoxCont">'; teml=teml+' <p id="#msgC">'+this.options.title+'</p>'; teml=teml+' </div>'; teml=teml+' <div class="opBoxBot disbox">'; if(this.options.btnConfirm!=""){ teml=teml+' <a href="javascript:;" class="btn-ok">'+this.options.btnConfirm+'</a>'; }else{ teml=teml+' <a href="javascript:;" class="disbox-1 btn-cancel">'+this.options.btnNo+'</a><a href="javascript:;" class="disbox-1 btn-ok">'+this.options.btnOk+'</a>'; } teml=teml+' </div>'; teml=teml+'</div>'; teml=teml+'<div class="mybg js-mybg" style="display:block;z-index:2200"></div>'; teml=teml+'</div>'; if($(".js-opBox").length===0){ $("body").append(teml); }else{ $(".js-opBox #msgC").html(this.options.title); } this.bindEvent(); }, bindEvent:function(){ var that = this; $(".btn-ok").on("click",function(){ if(typeof (that.options.callback)=="function"){ that.options.callback(); } }); $(".btn-cancel").on("click",function(){ that.boxClose(); }); }, boxClose:function(){ $("#opp").remove() } }; window.ConfirmBox = ConfirmBox; }());
/* opBox { */
.opBox {width:80%; padding:1rem 1rem 0;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box; position:fixed; top:50%; left:50%; z-index:2300; background:#fff; border-radius:10px;-webkit-border-radius:10px; overflow:hidden; transform: translate3d(-50%, -50%, 0px); -webkit-transform: translate3d(-50%, -50%, 0px); }
.opBox .opBoxHead { border-bottom:2px solid #00ADEB;padding:.5rem 0; font-size:1.6rem; height:1.5rem; line-height:1.5rem; color:#00ADEB; }
.opBox .opBoxCont {padding:1rem 0rem;}
.opBox .opBoxBot {border-top:1px solid #ececec; margin:0px -1rem;}
.opBox .opBoxBot a { display:block; text-align:center; padding:.8rem 0;border-left:1px solid #ececec;color:#00ADEB; }
.opBox .opBoxBot a:first-of-type {border-left:0 none;color:#7F7F7F;}
/* } opBox */