Javascript модель класса: вызов функции класса из диалогового определения

Question

Я использую класс модель Резига в (http://ejohn.org/blog/simple-javascript-inheritance/) и есть этот вопрос:

В классе ниже я строй удаления диалога. Когда нажата кнопка «Да», я хотел бы выполнить функцию handleDeleteItem. Как мне это сделать? Я не могу использовать «this.handleDeleteItem», поскольку «this» относится к диалоговому окну.

var bItem = Class.extend({ 
    init: function (type) { 
     this.id = type + "-" + getNewId(); 
    }, 
    registerDelete: function() { 
     var itemId = this.id; 

     // Build Delete Dialog 
     var deleteDialog = '<div id="' + itemId + '-delete-dialog" title="Delete Item?"><p><br/><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>Are you sure you want to delete this item?</p></div>'; 

     // Append dialog 
     $('#b-main').append(deleteDialog); 

     // Confirmation dialog 
     $('#' + itemId + '-delete-dialog').dialog({ 
      buttons : { 
       "Yes" : this.handleDeleteItem(), 
       "No" : function() { 
        $(this).dialog("close"); 
       } 
      } 
     }); 

     $("#dialog").dialog("open"); 
    }, 
    handleDeleteItem: function() {} 
}); 

Answer 1

Вы делаете все это неправильно. Попробуйте следующие вместо:

$('#' + itemId + '-delete-dialog').dialog({ 
    buttons : { 
     "Yes" : this.handleDeleteItem.bind(this), 
     "No" : function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

Обратите внимание, что я заменил this.handleDeleteItem() с this.handleDeleteItem.bind(this).

1. Когда вы делаете this.handleDeleteItem() вы призывающую this.handleDeleteItem и назначая его возвращаемое значение в качестве слушателя событий для «Да».
2. Когда вы делаете this.handleDeleteItem.bind(this), вы назначаете this.handleDeleteItem как прослушиватель событий для «Да». .bind(this) используется для обеспечения правильного указателя this.