自己编写jQuery插件之模拟alert和confirm.docx

下载文档

7
0
约5.1千字
约 6页
2016-12-30 发布于重庆
举报
版权申诉
保障服务

自己编写jQuery插件之模拟alert和confirm.docx

1、本文档共6页，可阅读全部内容。
2、有哪些信誉好的足球投注网站（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击这里二次下载。
4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。

啥也不说，先上图，有图有真相 :)?现在绝大多数网站都不用自带的alert和confirm了，因为界面太生硬了。因此这个插件就这样产生了...?来看插件的实现代码吧：(function () { $.MsgBox = { Alert: function (title, msg) { GenerateHtml(alert, title, msg); btnOk(); //alert只是弹出消息，因此没必要用到回调函数callback btnNo(); }, Confirm: function (title, msg, callback) { GenerateHtml(confirm, title, msg); btnOk(callback); btnNo(); } }//生成Htmlvar GenerateHtml = function (type, title, msg) {var _html = ; _html += div id=mb_box/divdiv id=mb_conspan id=mb_tit + title + /span; _html += a id=mb_icox/adiv id=mb_msg + msg + /divdiv id=mb_btnbox;if (type == alert) { _html += input id=mb_btn_ok type=button value=确定 /; }if (type == confirm) { _html += input id=mb_btn_ok type=button value=确定 /; _html += input id=mb_btn_no type=button value=取消 /; } _html += /div/div;//必须先将_html添加到body，再设置Css样式 $(body).append(_html); GenerateCss(); }//生成Cssvar GenerateCss = function () { $(#mb_box).css({ width: 100%, height: 100%, zIndex: 99999, position: fixed, filter: Alpha(opacity=60), backgroundColor: black, top: 0, left: 0, opacity: 0.6 }); $(#mb_con).css({ zIndex: 999999, width: 400px, position: fixed, backgroundColor: White, borderRadius: 15px }); $(#mb_tit).css({ display: block, fontSize: 14px, color: #444, padding: 10px 15px, backgroundColor: #DDD, borderRadius: 15px 15px 0 0, borderBottom: 3px solid #009BFE, fontWeight: bold }); $(#mb_msg).css({ padding: 20px, lineHeight: 20px, borderBottom: 1px dashed #DDD, fontSize: 13px }); $(#mb_ico).css({ display: block, position: absolute, right: 10px, top: 9px, border: 1px solid Gray, width: 18px, height: 18px, textAlign: center, lineHeight: 16px, cursor: pointer, borderRadius: 12px, fontFamily: 微软雅黑 }); $(#mb_btnbox).