Как обрабатывать события Backbone, реализующие google.maps.OverlayView?

Представление My 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


person devployment    schedule 15.10.2012    source источник
comment
представления имеют хеш событий events:{name:callback}, который привязан к корневому элементу через делегирование, поэтому надеюсь, что это сработает.   -  person Deeptechtons    schedule 15.10.2012
comment
К сожалению, events:{name:callback} не работает для моего пользовательского OverlayView, как я пытался показать в своем примере кода. Или я упускаю что-то существенное, что вы пытались мне сказать?   -  person devployment    schedule 16.10.2012
comment
Оверлей создается после добавления представления в дом?   -  person Deeptechtons    schedule 16.10.2012


Ответы (1)


Вы должны использовать this.setElement($(that.overlay.el)) в представлении после создания и добавления наложения в HTML, чтобы обновить EL, чтобы вы могли использовать хэш событий.

Если вы создадите новый оверлей, вам придется сделать это снова, чтобы EL указывал на правильную вещь.

Не забудьте обернуть его в объект Jquery, это очень помогло мне при попытке добавить обработчики событий в информационные блоки.

person Cristiano Fontes    schedule 17.10.2012
comment
Как легко это может быть. Теперь он работает с хешем событий. Большое спасибо. - person devployment; 17.10.2012