title: Google Maps Api V3 - Assigning Multiple Listeners to Same Marker Object
body: <p>Currently working on a project to upgrade our Goole Maps API from v2 to v3 and ran into an issue and need confirmation on whether it's possible to register multiple listeners to the same marker. Can anyone confirm whether Goole Maps API v3 supports multiple listeners on the same marker like API v2 can?</p>
  
  <p>Sample Code:</p>
  
  <pre><code>var mapObject = document.getElementById('map_canvas');
  var points = new Array();
  var markers = new Array();
  
  var mapOptions = {
      zoom: 16,
      center: new google.maps.LatLng(33.260081, -117.279369),
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      streetViewControl: false,
      draggable: true,
      scaleControl: false,
      zoomControl: true,                  
      panControl: true,                    
      scrollwheel: false,
      disableDoubleClickZoom: false,
      navigationControlOptions: {
      style: google.maps.NavigationControlStyle.ZOOM_PAN
  }
  
  map = new google.maps.Map(mapObject, mapOptions);
  
  points.push(lat:'33.260081', lng:'-117.279369');
  points.push(lat:'33.260079', lng:'-117.279371');
  points.push(lat:'33.260083', lng:'-117.279373');
  
  for (var i in points) {
  
      var point = points[i];
  
      var marker = initMarker(point);
  
      markers.push(marker);
  
      google.maps.event.addListener(marker, 'mouseover', function() {
          alert('mouseover');
      });
  
      google.maps.event.addListener(marker, 'click', function() {
          alert('click');
      });
  
      google.maps.event.addListener(marker, 'mouseout', function() {
          alert('mouseout');
      });
  
      bounds.extend(new google.maps.LatLng(point.lat, point.lng));
  }
  </code></pre>
  
  <p>When I hover over the marker, it alerts with 'mouseout', then 'mouseover' twice. I would expect it to just alert with 'mouseover' once.</p>
  
  <p>When I click a marker it alerts with 'click', then 'mouseout', then 'click', then 'mouseover'. I would expect it to just alert 'click'.</p>
  
  <p>When I disable 'mouseover' and 'mouseout', 'click' works as expected. And when I disable 'click' and 'mouseout', 'mouseover' works as expected.</p>
  
  <p>Is there any reason why these events seem to chain to each other? In API v2 we were able to support this functionality no problem.</p>
  
  <p>Thanks in advance.</p>
  
  <p>-- Edit --</p>
  
  <p>This only appears to be happening in Firefox and IE, Chrome handles the events as expected.</p>
  
  <p>-- Edit --</p>
  
  <p>I have gone ahead and setup 2 map demos so a side-by-side comparison 
  can be done.</p>
  
  <p>Version 2 Url: <a href="http://map.ownij.com/index2.php" rel="nofollow">http://map.ownij.com/index2.php</a> </p>
  
  <p>Version 3 Url: <a href="http://map.ownij.com/" rel="nofollow">http://map.ownij.com/</a></p>
  
  <p><strong>Version 2</strong> even listener behavior in <strong>Firefox, IE, Chrome</strong>:  </p>
  
  <ul>
  <li>mouseover: mouseover </li>
  <li>click: click</li>
  <li>mouseout: mouseout  </li>
  </ul>
  
  <p><strong>Version 3</strong> event listener behavior in <strong>Firefox, IE</strong>: </p>
  
  <ul>
  <li>mouseover: mouseout, mouseover, mouseover </li>
  <li>click: click, mouseout, click</li>
  <li>mouseout: mouseout, mouseout   </li>
  </ul>
  
  <p><strong>Version 3</strong> even listener behavior in <strong>Chrome</strong>:</p>
  
  <ul>
  <li>mouseover: mouseover </li>
  <li>click: click </li>
  <li>mouseout: mouseout </li>
  </ul>
  
  <p>As you can see, v3 event behavior works as expected in chrome, but in 
  FF and IE, each event triggers multiple listeners which results in 
  unusual behavior. </p>
  
  <p>We built our maps to allow a map bubble to appear 
  when a user hovers over a marker, so when the mouseover fires the 
  mouseout event, the bubble re-renders indefinitely until the user 
  moves the mouse off the marker.</p>
  
  <p>We cannot release our v3 upgrade until this has been resolved, 
  otherwise we rob our clients of current functionality.</p>
  
  <p>-- Edit --</p>
  
  <p>Updated code, by changing alerts to console.log() calls, the events fire as expected. It appears there is some unusual event handling with respect to non-infowindow calls (alerts, ebubble, etc.). </p>