jQuery append 不适用于谷歌地图

jQuery append not working with google maps

本文关键字：谷歌地图 适用于 不适用 append jQuery      更新时间：2023-09-26

我的jQuery追加函数不起作用。我有一个div，里面有一个名为"CollapsiblePanelContent"的类。我还有一个谷歌地图标记生成器，可以为我生成标记。我有一个数组标记Arr，其中包含来自XML的所有标记信息。当生成器完成时，我调用一个函数appendMarkers（）：

function appendMarkers() {   
for(var i = 0; i < markersArr.length;
i++) {      
var marker = markersArr[i];
$('.CollapsiblePanelContent').append("<a href='#'
onclick='showInfoWindow("+i+")>
 "+marker.getAttribute('name')+"</a><br>");     
} 
}

div 看起来像这样：

div class="CollapsiblePanelContent">

/div>

控制台日志记录给了我标记Arr的确切长度，并且检查谷歌地图和jquery是否加载都是积极的。

有人可以告诉我我做错了什么吗？

更新不知何故，当我在我的函数中使用 marker.getAttribute 时，它不起作用。但是当我执行以下操作时：

var name = markersArr[i].getAttribute("name")

并编辑以下内容以：

$('.CollapsiblePanelContent').append(name);

它确实奏效了。对我来说，目前尚不清楚为什么此更改使其有效。也许有人可以解释一下？

该函数包含语法错误。

使用 jQuery-way 而不是 string-concatenation 来创建元素：

      function appendMarkers() {
        for(var i = 0; i < markersArr.length; i++) {      
          var marker = markersArr[i];
          $('.CollapsiblePanelContent')
            .append($('<a>',{href:'javascript:void(0)'})
                    .text(marker.getAttribute('name'))
                     .click(i,showInfoWindow))
            .append('<br/>');    
          } 
        }

注意：showInfoWindow可以通过arguments[0].data访问i

参数

您可以向标记对象添加属性。检索后，您可以访问它们。所以：

假设您的标记是这样设置的：

var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                name: 'my name is...'
});

您可以通过以下方式在函数中检索名称：

function appendMarkers() {
    for (var i = 0; i < markersArr.length; i++) {
        var marker = markersArr[i];
        $('.CollapsiblePanelContent').append("<p>"+marker.name+"</p>");
    }
}
相关文章：