1

我正在编写一个通过 AJAX 获取 HTML 文档的 Javascript 应用程序,然后需要对其进行处理以将事件侦听器(特别是 Bootstrap 弹出窗口)附加到其中的元素。我很难连接听众,我相信这是一个范围问题。以下是相关代码:

var App = function(site){

  this.load = function(data, func){
    $('div.ajax').html(data);
    func();
  }

  this.dispatch = function(data){

    if(data.indexOf('from_server') !== -1){
      this.load(data, this.process);
      console.log('Loaded view from Matisse.');
      return true;
    }

  }

  this.process = function(){
    this.popovers('from_server');
  }

  this.popovers = function(el){
    var that = this;
    $('img.artwork.gallery', el).each(function(){
       $(this).popover({ trigger: 'hover', content: that.popoverPopulate(this) });
    });
  }

  this.popoverPopulate = function(el){
    return $(el).next('div.popover_content').html();
  }
}

var APP = new App();

$.ajax({blah: blah, success: function(data){ APP.dispatch(data); }});

...

问题(我认为)是func()调用this.load. 如果我通过它this.process(),那么它将“this”范围限定为窗口,并且出现错误。如果我通过this.process,它是一个创建的 lambda 并且它仍然失败。如果我打电话this.func()会出现同样的问题。

我如何 a) 使用回调将范围保持在 App 对象内,或者 b) 重新组织这个混乱以在加载后调用处理程序?

4

3 回答 3

5

我想你想var that=this在所有方法上使用范围技巧:

var App = function(site){

  var that = this;

  this.load = function(data, func){
    $('div.ajax').html(data);
    func();
  }

  this.dispatch = function(data){

    if(data.indexOf('from_server') !== -1){
      that.load(data, that.process);
      console.log('Loaded view from Matisse.');
      return true;
    }

  }

  this.process = function(){
    that.popovers('from_server');
  }

  this.popovers = function(el){
    $('img.artwork.gallery', el).each(function(){
       $(that).popover({ trigger: 'hover', content: that.popoverPopulate(this) });
    });
  }

  this.popoverPopulate = function(el){
    return $(el).next('div.popover_content').html();
  }
}
于 2012-04-11T02:04:16.343 回答
4

像这样的东西:

var App = function(site){
    var self = this; //-<!!!

    this.load = function(data, func){

    ...

    this.dispatch = function(data){
        if(data.indexOf('from_server') !== -1){
            self.load(data, self.process);
    ...
于 2012-04-11T02:06:11.583 回答
1

this 指的是当前使用它的上下文。因此,当您这样做时,this.process它将以窗口为目标。如果您这样做,App.load(data, App.process)那么它将针对App对象内的流程功能。

于 2012-04-11T02:06:02.783 回答