2

我有以下代码：

var Modal = Class.extend({
    //--- Default options
    defaults: {
        width: 300,
        height: 200
        // . . . more options
    },

    //--- Initialize the Modal class
    init: function (options) {
        //--- Extend defaults and options
        this.options = jQuery.extend(this.defaults, options);
    },

    //--- Create the Modal
    create: function () {

            // . . . code removed

            var closeButton = document.createElement("div");
            jQuery(closeButton)
                .attr({ "class": "modal_close" })
                .css({ "cursor": "pointer" })
                .live("click", function () {
                    this.closeModal();
                })
                .appendTo(modalHead);

            // . . . more code
    },

    //--- Hide the Modal
    closeModal: function () {
        // TODO : Code to hide the modal
        jQuery("#modal_container").fadeOut(200).remove();
        jQuery("#lean_overlay").fadeOut(200).remove();
    }
});

现在，当我在 create 方法中的 click 事件中尝试调用 delete 方法时，我收到此错误：

this.closeModal(); is not a function

我在这里想念什么？

编辑：将隐藏功能更改为 closeModal 只是为了简化我的问题

4

3 回答 3

9

替换this.hide();为$(this).hide();

后期编辑：

this输入前保留参考.live()

create: function () {
        // . . . code removed

        var closeButton = document.createElement("div");
        var myModal = this; 
        jQuery(closeButton)
            .attr({ "class": "modal_close" })
            .css({ "cursor": "pointer" })
            .live("click", function () {
                myModal.closeModal();
            })
            .appendTo(modalHead);

        // . . . more code
},
于 2012-11-21T14:44:49.827 回答
0

此问题源于 jQuery 已将引发事件的 DOM 元素绑定到this. 要解决这个问题，只需使用以下

.live('click', this.closeModal)

如果要缓存对Modalin 的当前实例的引用，init function可以执行以下操作：

init: function () {
    this.me = this;
}

引用它时只记得使用this.me（不仅仅是me）。

于 2012-11-21T14:48:15.043 回答
0

尝试：

.live('click', $.proxy(this, 'hide'))
于 2012-11-21T14:52:48.707 回答