0

我的 Backbone 视图实现了一个google.maps.OverlayView().

此视图包含一些 div 的内容,我需要处理容器 div 上的鼠标悬停/移出和单击两个包含 div 的事件。

我能够获得所需事件的唯一方法是google.maps.event.addDomListener在我的视图中使用。像这样的东西(复制和粘贴代码):

var MarkerView = MasterView.extend({
    events:{
        //These events will never be fired
        'click .icon-context':function () {},
        'mouseout':function (event) {}
    },
    render:function(){
      //this renders the google.maps.OverlayView by implementing onAdd, draw, onRemove 
      var that = this;

      this.overlay.onAdd = function(){
        //Code for adding the OverLayView omitted here

        that.listeners_ = [
          google.maps.event.addDomListener(that.overlay.el, 'mouseout', function () {
            //This event should not be handled here
          }),
          google.maps.event.addDomListener($(that.overlay.el).find('.icon-context').first()[0], 'click', function () {
            //This event should not be handled here
          }),            
        ];

      };

    }
});

视图逻辑的核心部分应该是可重用的,因为我想在地图和显示/处理几乎相同内容的列表中使用它。通过将我的视图绑定到 Google Maps 事件侦听器,我将不得不为事件处理复制大量代码。感觉这样做并不完全正确。

如果视图托管在google.maps.OverlayView

4

1 回答 1

1

创建叠加层并将其添加到 HTML 后,您必须this.setElement($(that.overlay.el))在视图上使用,以便更新 EL,以便您可以使用事件哈希。

如果您实例化一个新的覆盖,您必须再次执行以使 EL 指向正确的对象。

不要忘记将它包装在 Jquery obj 中,这在尝试将事件处理程序添加到 infoBoxes 时帮助了我很多

于 2012-10-17T11:52:30.033 回答