无痛呻吟之jquery讯息提示框
无痛呻吟之jquery消息提示框
工作需要,对jquery弹出框消息插件稍作修改,此插件扩展性、可读性等不错。
参考效果图:
部分代码,详情请下载附件:
/** * 两个按钮消息div * * @param {string} * msg 消息内容 * @param {string} * isOpen 是跳转还是弹出框 * @param {string} * urlF btnF按钮跳转地址 * @param {string} * urlS btnS按钮息跳转地址 * @param {string}操作按钮名称1 * @param {string}操作按钮名称2 * @param {object} * 属性对象 */ $.fn.jconfirm = function(msg,isOpen,urlF,urlS, btnF, btnS, options) { var opts = $.extend({}, $.fn.jconfirm.defaults, options); var $msg_box = msgBox(opts.title, msg, opts.width, opts.height); var $btn_ok = msgBox_btn(btnF, function() { getMaskOrMsgBoxDiv().hide("slow", function() { $(this).detach(); if (urlF) { if(isOpen){ window.open(urlF); }else{ window.location.href = urlF; } } }); }); var $btn_cancel = msgBox_btn(btnS, function() { getMaskOrMsgBoxDiv().hide("slow", function() { $(this).detach(); }); if (urlS) { if(isOpen){ window.open(urlS); }else{ window.location.href = urlS; } } }); $msg_box.find("#" + div_msg_box_bottom.id).append($btn_ok).append( $btn_cancel); if (opts.mask) { $msg_box = mask(opts.maskcolor).append($msg_box); } this.after($msg_box); }; // 确认消息div默认属性 $.fn.jconfirm.defaults = { title : '确认消息框', width : 320, height : 240, mask : true, maskcolor : 'rgba(165, 165, 165, 0.8)' };