学习--jquery 自定义插件 面向对象 -- 模拟 jquery EasyUi的 自定义 alert + confirm
来源:互联网 发布:北京宽带哪个好 知乎 编辑:程序博客网 时间:2024/06/04 20:05
(function ($) { /** * 窗口外框 * @returns {*} */ function my_window() { var win = $('<div class="m-layer z-display"></div>').appendTo('body'); return win; }; function my_table() { var table = $('<table></table>'); return table; }; function my_tr() { var tr = $('<tr></tr>'); return tr; }; function my_td() { var td = $('<td></td>'); return td; }; function my_lywrap() { var div = $('<div class="lywrap"></div>'); return div; }; /** * 标题 * @returns {*} */ function my_title(text) { var lytt = $('<div class="lytt"></div>'); var title = $('<h2 class="clx-font-bold clx-article-fontColor clx-font-xl">标题</h2>').appendTo(lytt); title.html(text); return lytt }; function my_lyct(text) { var lyct = $('<div class="lyct"></div>'); lyct.html(text); return lyct; }; /** * 文本内容 * @returns {*} */ function my_content(text) { var content = $('<p class="warring-text">确定要执行此操作?</p>'); content.html(text); return content; }; /** * 关闭 X 按钮 * @returns {*} */ function my_close() { var close = $('<span class="lyclose">×</span>'); close.click(function () { $('body').css({overflow: ''}); $('body > div.z-show').remove(); }); return close; }; /** * 按钮区域组 * @returns {*} */ function my_lybt() { var lybt = $('<div class="lybt"></div>'); return lybt; }; /** * 按钮区域组 * @returns {*} */ function my_buttonGroup() { var group = $('<div class="check-btn-group"></div>'); return group; }; /** * 确定按钮 * @returns {*} */ function my_ok(callback) { var ok = $('<a class="clx-sure-btn">确定</a>'); ok.click(function () { if (callback) { callback(true); } my_close().click(); }); return ok; }; /** * 取消按钮 * @returns {*} */ function my_cancel(callback) { var cancel = $('<a class="clx-default-btn">取消</a>'); cancel.click(function () { if (callback) { callback(false); } my_close().click(); }); return cancel; }; /** * $.messager 相当于定义一个java的 类对象 * $.messager.alert,$.messager.confirm 相当于 类中的方法 * * @param options * @returns {boolean} */ $.messager = { alert: function (tt, message) { // 动态拼接模块 var win = my_window(); var table = my_table().appendTo(win); var table_tr = my_tr().appendTo(table); var table_tr_td = my_td().appendTo(table_tr); var table_tr_td_lywrap = my_lywrap().appendTo(table_tr_td); var table_tr_td_lywrap_title = my_title(tt).appendTo(table_tr_td_lywrap); my_lyct(message).appendTo(table_tr_td_lywrap); my_close().appendTo(table_tr_td_lywrap_title); win.removeClass('z-display').addClass('m-layer z-show'); $('body').css({overflow: 'hidden'}); }, confirm: function (tt, message, callBack) { // 动态拼接模块 var win = my_window(); var table = my_table().appendTo(win); var table_tr = my_tr().appendTo(table); var table_tr_td = my_td().appendTo(table_tr); var table_tr_td_lywrap = my_lywrap().appendTo(table_tr_td); var table_tr_td_lywrap_title = my_title(tt).appendTo(table_tr_td_lywrap); var table_tr_td_lywrap_lyct = my_lyct(my_content(message)).appendTo(table_tr_td_lywrap); var table_tr_td_lywrap_lybt = my_lybt().appendTo(table_tr_td_lywrap); var table_tr_td_lywrap_lybt_buttonGroup = my_buttonGroup().appendTo(table_tr_td_lywrap_lybt); my_close().appendTo(table_tr_td_lywrap_title); my_ok(callBack).appendTo(table_tr_td_lywrap_lybt_buttonGroup); my_cancel(callBack).appendTo(table_tr_td_lywrap_lybt_buttonGroup); win.removeClass('z-display').addClass('m-layer z-show'); $('body').css({overflow: 'hidden'}); } }; // 类对象的扩展属性 $.messager.defaults = {ok: "Ok", cancel: "Cancel"};})(jQuery);/** * 调用方法 */$(function () { $('#alert').click(function () { $.messager.alert("操作提示", "您确定要执行操作吗?"); }); $('#confirm').click(function () { $.messager.confirm("操作提示", "您确定要执行操作吗?", function (data) { if (data) { alert("确定"); } else { alert("取消"); } }); });});
0 0
- 学习--jquery 自定义插件 面向对象 -- 模拟 jquery EasyUi的 自定义 alert + confirm
- jquery-confirm自定义alert插件,alert显示内容可以换行
- jquery自定义对话框alert、confirm和prompt
- jquery自定义对话框alert、confirm和prompt
- 基于jQuery的窗口插件:jMessageBox 代替alert,confirm
- jquery 自定义alert
- 自定义alert和confirm
- [原创]使用自定义的alert和confirm
- [ jQuery ] jquery 自定义插件!
- jQuery EasyUI自定义validatebox
- 模拟jquery的javascript自定义可扩展插件
- Jquery面向对象:自定义的页签控件
- 自定义jQuery插件的写法
- jquery-confirm应用 alert confirm 弹出 弹窗
- bootstrap 自定义alert 和 confirm
- jQuery EasyUI自定义DataGrid的Editor
- 【jQuery】jQuery自定义插件开发
- JQuery的Alert插件介绍
- 限制UITextField 输入字数
- 卸载VMware Workstation
- uefi启动是什么意思 UEFI启动对比Bios启动优势在哪里
- Android中插件开发篇之----类加载器
- 《apue》读书笔记 停止更新
- 学习--jquery 自定义插件 面向对象 -- 模拟 jquery EasyUi的 自定义 alert + confirm
- c#页面缓存
- 【转】sprintf
- 库里可超科比单场81分 萌神46投能砍100分?
- 第十二周项目2 操作用邻接表储存的图
- 最全Pycharm教程(7)——虚拟机VM的配置
- Win7电脑中外网网卡共享
- 【Codeforces Round 331 (Div 2)C】【脑洞 SET贪心写法】Wilbur and Points 锯齿图形差值编号,右上角的最大
- TS科普18 节目映射表PMT