当我尝试调用 Google Place Markers 时，图像选择器无法正常工作

Posted 2023-05-09

【中文标题】当我尝试调用 Google Place Markers 时，图像选择器无法正常工作

【英文标题】：Image Picker is not working in when I try to call Google Place Markers

【发布时间】：2014-04-29 00:10:05

【问题描述】：

所以我正在使用这个 Image Picker jQuery 插件 (http://rvera.github.io/image-picker/) 来显示图片和 Google Places POI 的名称。

我像下面这样调用了 jQuery 函数：

<script>
    $(document).ready(function () 
        $("select").imagepicker(
            hide_select: false,
            show_label: true
        )
    );
</script>

然后在 javascript 中，我调用 createMarkers 方法来获取 POI 图像和名称，如下所示：

function createMarker(place) 
        ....

        //get POI photos and descriptions
        var photos = place.photos;
        if (photos) 
            //placesList.innerhtml += '<img src=' + photos[0].getUrl( 'maxWidth': 80, 'maxHeight': 80 ) + '>';
            placesList.innerHTML += '<option data-img-src=' + photos[0].getUrl( 'maxWidth': 80, 'maxHeight': 80 ) + ' value=' + encodeURI(place.name) + '> ' + place.name + ' </option>';
        ;
        if (!photos) 
            //placesList.innerHTML += '<img src="images/POI.png"  >';
            placesList.innerHTML += '<option data-img-src="images/POI.png" value=' + encodeURI(place.name) + '>' + place.name + '</option>';


        ;
    

上面的 JavaScript 会生成这个 HTML：

<option data-img-src="https://lh6.googleusercontent.com/-4bnhVag9P98/UD6MLNW_EzI/AAAAAABTrV4/H91UaZkqFYg/w80-h80-s1600/Stedelijk%2BMuseum%2BAmsterdam" value="Stedelijk%20Museum"> Stedelijk Museum </option>

问题是，即使我有正确的 JavaScript 和正确的 HTML 结果，为什么 jQuery 不能工作？提前感谢您提供宝贵的见解。

干杯， 妮莎

【参考方案1】：

我是插件的创建者，我知道我来晚了。你能解决这个问题吗？

如果您要动态更新 html，则需要重新初始化选取器。我建议先填充“选择”元素，然后调用选择器。