javascript - 无法在 Google map 信息框上添加事件

Question

我正在使用带有 Google Map V3 的 Infobox(附图)。单击信息框时，我想转到详细信息页面。但我无法在信息框上添加点击监听器。这是我正在使用的代码:



这是我的信息框配置:

    var ib = new InfoBox({
        alignBottom : true,
        disableAutoPan: false,
        maxWidth: 0,
        pixelOffset: new google.maps.Size(-125, -50),
        zIndex: null,
        closeBoxURL: "",
        infoBoxClearance: new google.maps.Size(1, 1),
        isHidden: false,
        pane: "floatPane",
        enableEventPropagation:false
    });

我向这个信息框添加了监听器，如下所示:

    google.maps.event.addListener(ib, 'domready', function() {
        if(Ext.get(ib.div_)){
            Ext.get(ib.div_).on('click', function(){
                console.log('test on click')
            }, this);

            Ext.get(ib.div_).on('mousedown', function(){
                console.log('test on click')
            }, this);
        }
    });

而 enableEventPropagation = false ，该事件不会传播到 MAP，但信息框上没有任何事件正在运行。

而 enableEventPropagation = true ，事件(单击，鼠标按下)有效，但单击信息框的其他部分，我需要映射或其他标记。

知道如何解决这个问题吗？

Answer 1

您需要添加domready信息框的事件监听器的事件不是谷歌地图的事件。只有在 infobox 的 html 出现在屏幕上后，您才能绑定(bind)事件。为防止多事件绑定(bind)，请在加载新信息框之前关闭其他信息框。

infobox= new InfoBox();
google.maps.event.addListener(marker, 'click', function() {
  infobox.close();
  infobox= new InfoBox({ ... });
  infobox.open(map, this);
  infobox.addListener("domready", function() {
    $("#target").on("click", function(e) { /* do something */ });
  });
});