Question

我是jQuery小部件的新手并尝试学习它，我创建了一个用于显示对话框的小部件，小部件的_create()方法执行以下操作：

添加用于隐藏用户屏幕的掩码对话框。添加一个关闭“按钮”，这是一个带有click事件处理程序的div 向用户显示对话框

当我单击关闭div时，我可以使用以下命令删除窗口小部件实例 -

$(this).parent().remove();

我找不到隐藏我在_create方法中创建的屏幕遮罩div的方法。

创建和关闭方法的代码如下 -

_create: function () {
            var handle = this;
            if (this.options.Height == 0) this.options.Height = this.element.height();
            if (this.options.Width == 0) this.options.Width = this.element.width();
            $(document.body).css({ margin: 0, padding: 0 });
            this.wrapper = $("<div class='wrapperClass'>").css({
                'height': this.options.Height,
                'width': this.options.Width,
                'position': 'absolute',
                'left': '50%',
                'margin-left': -1 * this.options.Width / 2,
                'top': '50%',
                'margin-top': -1 * this.options.Height / 2,
                'border': '3px solid red',
                'border-radius': this.options.Radius,
                'z-index': this.options.Zindex
            });
            //create the screen masking background 
            this.maskScreen = $('<div />').css({ 'height': '100%', 'width': '100%', 'position': 'absolute', 'top': 0, 'left': 0, 'background-color': this.options.bgColor, 'z-index': this.options.Zindex - 1, 'display': 'block', 'opacity': this.options.bgOpacity, 'margin': 0, 'padding': 0 });
            $('body').append(this.maskScreen);
            this.element.css('display', 'block');
            this.wrapper.html(this.element);
            $('body').append(this.wrapper);
            if (this.options.addClose) this._addClose();
        },
        _addClose: function () {
            this.closeButton = $('<div />')
            //add close class
            .addClass("closeClass").css("z-index", this.options.Zindex + 1);
            this.closeButton.on("click", function () {

                $(this).parent().remove();

            });
            this.wrapper.append(this.closeButton);
        },

如何引用我在div方法中创建的屏幕遮罩 _create()？

Answer 1

您应该使用jqueryUI小部件_destroy方法为您进行清理，这样您就可以引用在_create方法中添加的所有变量和元素并将它们全部删除以正确的顺序恢复环境。

在这种情况下，您的closeButton应该只调用窗口小部件实例的_destroy方法，而不是自行删除。

如果您可以发布有效的jsFiddle，我会告诉您实际的代码。

处理jQuery小部件关闭方法

1 个答案: