Question

我有这段代码。

var NotificationsBox={
    HideNotificationBox:function()
    {
          document.getElementById("NotificationBox").style.visibility="hidden"; 
    },
    toggleNotificationBox:function()
    {
        $('#NotificationBox').toggle();             
    },
    SetContainerClick_NotificationHide_Event:function()
    {
        $('#Container').click(this.HideNotificationBox);        
    },
    SetNotificationBoxClick_NotificationToggleEvent:function()
    {
        $('#ShowNotification').click(function(){
            $(this).html("0");
            $(this).css("background-color","#000");

            this.toggleNotificationBox();     ///  <-- PROBLEM
        });
    }

};

NotifyBox=Object.create(NotificationsBox);
NotifyBox.HideNotificationBox();
NotifyBox.SetContainerClick_NotificationHide_Event();
NotifyBox.SetNotificationBoxClick_NotificationToggleEvent();

现在您可以看到问题所在。此处this将引用#ShowNotification，我想在此引用NotificationBox，以便我可以调用该函数。

Answer 1

在绑定this之前保存对click的引用，并在this事件处理程序中使用此引用而不是click：

SetNotificationBoxClick_NotificationToggleEvent:function()
{
    var self = this;
    $('#ShowNotification').click(function(){
        $(this).html("0");
        $(this).css("background-color","#000");

        self.toggleNotificationBox(); //  <-- self will refer to NotificationsBox
    });
}

或者，作为替代方法，使用NotificationsBox.toggleNotificationBox()，但如果您碰巧更改变量NotificationsBox的名称，这将停止工作：

SetNotificationBoxClick_NotificationToggleEvent:function()
{
    $('#ShowNotification').click(function(){
        $(this).html("0");
        $(this).css("background-color","#000");

        NotificationsBox.toggleNotificationBox();
    });
}

在jquery事件中引用javascript对象

1 个答案: