jquery Esc按钮退出弹出框

最新推荐文章于 2021-09-09 14:28:48 发布

愚不白

最新推荐文章于 2021-09-09 14:28:48 发布

阅读量1.5k

点赞数 1

文章标签： javascript jquery

本文链接：https://blog.csdn.net/weixin_44353972/article/details/103703723

版权

最近在做功能的时候，每次关闭弹出框都要进行点击关闭按钮，着实有点烦躁，所以在网上搜罗了很多的Esc按钮进行退出弹出框，在这里记录一笔方便以后使用
Esc按钮退出，这里使用的背景是在使用jQuery EasyUi时的扩展功能
easyui扩展

js文件

(function ($) {

    $.util.namespace("$.fn.window.extensions");


    $(function () {
        //  在当前打开 modal:true 的 easyui-window 或者 easyui-dialog 时，按 ESC 键关闭顶层的 easyui-window 或者 easyui-dialog 对象。
        $(document).keydown(function (e) {
            if (e.which != 27) {
                return;
            }

            var items = $("div.window-mask:visible");
            if (!items.length) {
                return;
            }
            var item = $.array.max(items, function (a, b) {
                return $(a).css("zindex") - $(b).css("zindex");
            })
            $(item).prevAll("div.panel.window:first").children(".window-body").each(function () {
                if (!$.data(this, "window")) {
                    return;
                }
                var t = $(this),
                    opts = t.window("options");
                if (opts && opts.closable && opts.closeOnEsc && !t.window("header").find(".panel-tool a").attr("disabled")) {
                    t.window("close");
                }
            });
        });
    });

    var methods = {

    };

    var defaults = {

        //  扩展 easyui-window 以及 easyui-dialog 控件的自定义属性，表示该窗口为模式窗口时，是否在按下 ESC 时关闭该窗口，默认为 true。
        //  落阳注：要使该自定义属性有效，window/dialog 的options中，modal 属性和 closable 属性必须为 true 。
        closeOnEsc: true
    };

    var compent = $.fn.window;
    if (compent.extensions.defaults) {
        $.extend(compent.extensions.defaults, defaults);
    } else {
        compent.extensions.defaults = defaults;
    }

    if (compent.extensions.methods) {
        $.extend(compent.extensions.methods, methods);
    } else {
        compent.extensions.methods = methods;
    }

    $.extend(compent.defaults, defaults);
    $.extend(compent.methods, methods);

})(jQuery);