我正在尝试将click事件绑定到我的infoBubble中的标记，unfotunatley我根本没有运气。这是我的代码和我尝试过的一些例子。
setTimeout(function () {
var options = {
zoom: 8,
mapTypeControl: false,
center: new google.maps.LatLng(sonypro.locator.map.defaults.lat,sonypro.locator.map.defaults.lon),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
sonypro.locator.map.view = new google.maps.Map(document.getElementById(sonypro.locator.selector_id.map),options);
sonypro.locator.map.panorama = sonypro.locator.map.view.getStreetView();
google.maps.event.addListener(sonypro.locator.map.panorama, 'visible_changed', function() {
if (sonypro.locator.map.panorama.getVisible()) {
if (!$('#'+sonypro.locator.selector_id.sidebar).hasClass('closed')) {
$('#'+sonypro.locator.selector_id.handle_btn).click();
}
$('#'+sonypro.locator.selector_id.sidebar).hide();
} else {
$('#'+sonypro.locator.selector_id.sidebar).show();
if ($('#'+sonypro.locator.selector_id.sidebar).hasClass('closed')) {
$('#'+sonypro.locator.selector_id.handle_btn).click();
}
}
});
sonypro.locator.map.bounds = new google.maps.LatLngBounds();
if (sonypro.locator.map.dealers.length > 0) {
for (var i = 0; i < sonypro.locator.map.dealers.length; i++) {
var image = new google.maps.MarkerImage(
'/assets/images/content/markers/marker' + i + '.png',
new google.maps.Size(20, 34),
new google.maps.Point(0,0),
new google.maps.Point(9, 26)
);
var dealer = sonypro.locator.map.dealers[i];
//info as html
var info_content = sonypro.locator.list.template(dealer.name,dealer.address,dealer.telephone,dealer.email,dealer.website);
//set markers
var myLatLng = new google.maps.LatLng(dealer.lat, dealer.lng);
sonypro.locator.map.markers[i] = new google.maps.Marker({
id: dealer.id,
position: myLatLng,
map: sonypro.locator.map.view,
icon: image,
shape: {coord: [1, 7, 9, 25, 16, 7, 13 , 3, 9 , 1, 4 , 3],type: 'poly'},
title: dealer.name,
info: info_content
});
//set infobubble
var infoBubble = new InfoBubble({
map: sonypro.locator.map.view,
content: '',
position: myLatLng,
shadowStyle: 0,
padding: 15,
backgroundColor: 'rgb(255,255,255)',
minWidth: 160,
maxWidth: 240,
minHeight: 80,
maxHeight: 300,
borderRadius: 0,
arrowSize: 10,
borderWidth: 1,
borderColor: '#f36700',
disableAutoPan: true,
hideCloseButton: false,
arrowPosition: 18,
backgroundClassName: sonypro.locator.classes.infowindow,
arrowStyle: 0
});
//bounding
sonypro.locator.map.bounds.extend(myLatLng);
sonypro.locator.map.view.fitBounds(sonypro.locator.map.bounds);
//set infowindows
google.maps.event.addListener(sonypro.locator.map.markers[i], 'click', function () {
console.log('Something clicked');
var _lm = sonypro.locator.map.last_viewed_marker;
if (_lm == -1 || (_lm != -1 && _lm != this.id) || infoBubble.isOpen() == false) {
infoBubble.content = this.info;
infoBubble.open(sonypro.locator.map.view, this);
sonypro.locator.map.view.setCenter(this.getPosition());
sonypro.locator.map.last_viewed_marker = this.id;
}
});
$(infoBubble.bubble_).live("click", function() {
console.log('clicked!');
});
$(".icon.phne", infoBubble.bubble_).live("click", function() {
console.log('actived jimmy!');
});
}
sonypro.locator.list.init();
}
}, 500);
上面的一些代码可能不相关，而且还有更多但又不确定所有这些代码是否必要但我可以在必要时发布所有代码。
我也试过使用.live（）和.on（）无济于事。
以下是信息气泡内容的模板。我试图将点击事件绑定到的图标的整个选择器是（.pge-dl-engagement .dealer-wrapper .dealer-infowindow a.icon.phne）
template: function (name,address,telephone,email,link) {
var content = '',_name = '',_address = '',_telephone = '',_email = '',_link = '';
if (!sonypro.helper.isEmpty(name)) _name = '<h3>'+name+'</h3>';
if (!sonypro.helper.isEmpty(address)) _address = '<p>'+address+'</p><p class="display">'+telephone+'</p></div>';
if (!sonypro.helper.isEmpty(telephone)) _telephone = '<div class="icons"><a class="icon phne"></a>';
if (!sonypro.helper.isEmpty(email)) _email = '<a class="icon email" href="mailto:'+email+'"></a>';
if (!sonypro.helper.isEmpty(link)) _link = '<a class="icon link" target="_blank" href="'+link+'"></a></div>';
content = _name + _address + _telephone + _email + _link + '<div class="space cf">-</div>';
sonypro.locator.list.html = sonypro.locator.list.html + '<li class="cf"><div class="dtls">' + content + '</li>';
return content;
}
答案 0 :(得分：0)
$(document).on('click', '.email', function(e){...});应该有效。
答案 1 :(得分：0)
这结果是解决方案，尽管它可能与您可能需要的有点不同：
google.maps.event.addListener(sonypro.locator.map.markers[i], 'click', function () {
//do stuff
}