如何为Google Maps标记点的信息窗口添加新按钮？

没问题！要给Google Maps标记点的信息窗口加自定义按钮其实很简单，主要分两步来做——先在信息窗口的HTML内容里添加按钮元素，再给按钮绑定点击事件（因为信息窗口的DOM是动态生成的，直接写onclick容易出问题，推荐用信息窗口的domready事件来绑定）。

我结合你提供的代码，修改出了完整的实现方案：

function initMap() {
  var uluru = {lat: -25.363, lng: 131.044};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru
  });

  // 更新信息窗口的HTML内容，加入自定义按钮
  var contentString = '<div id="content">'+
    '<div id="siteNotice">'+
    '</div>'+
    '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
    '<div id="bodyContent">'+
    '<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large sandstone rock formation in the southern part of the Northern Territory, central Australia. It lies 335 km (208 mi) south west of the nearest large town, Alice Springs; 450 km (280 mi) by road. Kata Tjuta and Uluru are the two major features of the Uluru - Kata Tjuta National Park. Uluru is sacred to the Pitjantjatjara and Yankunytjatjara, the Aboriginal people of the area. It has many springs, waterholes, rock caves and ancient paintings.</p>'+
    // 这里添加自定义按钮，可修改文字、ID或样式
    '<button id="customUluruBtn">查看更多详情</button>'+
    '</div>'+
    '</div>';

  var infowindow = new google.maps.InfoWindow({
    content: contentString
  });

  var marker = new google.maps.Marker({
    position: uluru,
    map: map,
    title: 'Uluru (Ayers Rock)'
  });

  // 标记点点击时打开信息窗口
  marker.addListener('click', function() {
    infowindow.open(map, marker);
  });

  // 监听信息窗口的domready事件，确保按钮加载完成后绑定点击逻辑
  infowindow.addListener('domready', function() {
    document.getElementById('customUluruBtn').addEventListener('click', function() {
      // 这里写按钮点击后的操作，示例：弹出提示或页面跳转
      alert('你点击了Uluru的自定义按钮！');
      // 示例跳转：window.location.href = '/uluru-details-page';
    });
  });
}

关键步骤说明： #

• 添加按钮元素：在contentString的内容区块里插入<button>标签，你可以根据需求修改按钮的文字、ID，甚至添加class来自定义样式。
• 绑定事件的正确时机：使用infowindow.addListener('domready', ...)监听信息窗口DOM加载完成的事件，这时候再获取按钮并绑定点击事件，能避免“找不到元素”的错误——因为信息窗口的内容是动态渲染的，只有domready触发后，按钮才真正存在于页面的DOM树中。
• 多标记点场景处理：如果地图上有多个标记点需要自定义按钮，只需确保每个按钮的ID唯一，或者用类选择器（比如<button class="map-info-btn">）结合事件委托来批量处理，减少重复代码。

内容的提问来源于stack exchange，提问作者Selin Elibol