简易封装confirm $.confirm

Posted 2020-09-25

$.confirm=function(obj){
    function defaultObj(){
        this.msg=‘确定要删除吗‘;
        this.yes=function(){
            
        };
        this.no=function(){
            
        };
        
        this.confirms=$(‘<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"  data-keyboard="false"  data-backdrop="static"><div class="modal-dialog"><div class="confirmBox"><p id="confirmTitle">提示</p><p id="confirmMsg"></p><span id="confirmBtn" style="margin-left:82px">确定</span><span style="margin-left:8px;" class="confirmClose">取消</span></div></div></div>‘);
    }
    
    defaultObj.prototype.init=function(){
        $("body").append(this.confirms);
        $("#confirmModal").modal("show")
        $("#confirmMsg").text(this.msg)
    }
    var confirm=$.extend(new defaultObj,obj);
    
    confirm.init();
    $("#confirmBtn").off("dblclick")
    $("#confirmBtn").on("click",onc)
    function onc(){
        $("#confirmBtn").off("click")
        console.log("事件已经解绑，看看能不能再次触发")
        confirm.yes();
        $("#confirmModal").modal("hide")
    }
    $(".confirmClose").click(function(){
        confirm.no();
        $("#confirmModal").modal("hide")
    })
    $(‘#confirmModal‘).on(‘hidden.bs.modal‘, function (e) {
        confirm.confirms.remove()
    })
    
}    
//调用
//$.confirm({‘msg‘:‘文字‘,‘yes‘:function(){},‘no‘:function(){}})
//需要jquery 和 bootstrap支持