添加事件处理程序在信息窗口内的元素谷歌地图v3

Question

您好，我正在尝试添加到信息窗口内的按钮，我尝试过这样的事件

var infoWindow = new google.maps.InfoWindow({
    content: '<div></br><span class="formatText">Ubicacion del Marcador: </span>' + event.latLng.toString() 
            + '</br> <input type="button" id="btnPrueba" value="prueba"/></div>'
});

google.maps.event.addListener(marker, 'click', function () {
    infoWindow.open(map, this);
    google.maps.event.addDomListener(document.getElementById('btnPrueba'), 'click', removeMarker);
});

function removeMarker(){

    alert('it works');
}

我做错了什么？或者这是另一种方法来做到这一点？谢谢

编辑

我也尝试过像这样的jquery，但是尽管它是通过函数获取的事件，但警报没有显示。当我用 chrome 进行调试时，它可以工作:(

google.maps.event.addListener(marker, 'click', function () {
    infoWindow.open(map, this);
    $("#btnPrueba").click(function () {

        alert('funciona');
    });
});

Answer 1

尝试按钮的“onclick”属性。

'<input type="button" id="btnPrueba" value="prueba" onclick="removeMarker()"/>'

Answer 2

调用像 @DeeV 所示的全局函数确实看起来是最直接的方法（除了稍微弄脏全局命名空间，这在当今被看不起）。 jQuery 事件委托确实可以在没有任何额外的 setTimeout 体操的情况下工作，但感觉就像一个更重的函数调用堆栈来完成相同的目标。例如

$("#myMapContainer").on("click", "#btnPrueba", function() {alert "it works";});

，但是，坚持使用全局方法，除了@DeeV的答案之外，通常的技巧是获取一些可以在该事件处理程序中执行操作的上下文值：

• 一种方法是将参数值嵌入到函数调用中
  InfoWindow 内容字符串
• 沿着这些线，当您生成每个标记时，推送
  它是对数组的引用（也必须是全局的），从而方便
  稍后在处理程序中调用标记 API（例如 setIcon() 等），

例如 JS 伪代码

var myMarkerArray = [];

function removeMarker(markerIndex) {
  myMarkerArray[markerIndex].setMap(null);
}

for(int i=0; i<myLocationData.length; i++) {
  var marker = new google.maps.Marker({...});
  myMarkerArray.push(marker);
  var popup = new google.maps.InfoWindow({ content: '<input type="button" id="btnPrueba" value="prueba" onclick="removeMarker('+i+')"/>' });
}

Answer 3

我的解决方法是使用较短的超时。

var infoWindow = ...  (as in your question) ...
infoWindow.open(...);

setTimeout(function(){
  $('#btnPrueba').on('click', function(e){
    alert("It works at last!");
    });
  },50);  //Wait for 0.05s

当我不使用 setTimeout 包装器时，它不起作用。即使 setContent() 和 open() 已经被调用。我认为这意味着创建是异步完成的。

注意：“50”是一个神奇的数字，因此可能很脆弱。

注意：使用以下内容对我来说也不起作用，我仍然觉得很奇怪并且无法解释：

$('#btnPrueba').on('click', document, function(e){
  alert("No luck...");
  });