Question

我在这里的第一个问题。我正在通过从外部php文件中获取来自json对象的数据来构建谷歌地图，在那里它获取了餐馆列表（在这种情况下是4家餐馆）和他们的信息，并且使用此信息我在地图上构建标记然后显示餐馆列表，当我点击餐馆的名称时，它应该在地图上显示，从标记，这个功能不起作用，这里是代码：

$(document).ready(function(){
   $.ajax({
       type:"GET",
       url:"proxy.php",
       dataType:"json",
       contentType:"text/json",
       success:function(res){
           $.post('getinfo.php', {data: res}, function(data){

                response = jQuery.parseJSON(data);  
                if (GBrowserIsCompatible()) {
                    var map = new GMap2(document.getElementById("google_map_div"));
                    map.addControl(new GLargeMapControl());
                    map.addControl(new GMapTypeControl());
                    map.setCenter(new GLatLng(0,0),0);

                    var side_bar_html = "";
                    var gmarkers = [];
                    var htmls = [];
                    var i = 0;

                    function createMarker(point,name,html) {
                        var marker = new GMarker(point);
                        GEvent.addListener(marker, "click", function() {
                          marker.openInfoWindowHtml(html);
                        });
                        gmarkers[i] = marker;
                        htmls[i] = html;
                        side_bar_html += '<a href="javascript:openInsideMap(' + i + ')">' + name + '</a><br>';
                        return marker;
                        //
                     }

                     function openInsideMap(i){
                        alert("WORKING" + i);
                        gmarkers[i].openInfoWindowHtml(htmls[i]);
                     }

                    var bounds = new GLatLngBounds();

                    for(i=0; i<response.length;i++){
                        var j = i + 1;
                        // obtain the attribues of each marker
                        var lat = parseFloat(response[i].langt);
                        var lng = parseFloat(response[i].longt);
                        var point = new GLatLng(lat,lng);
                        var html = response[i].localName + ": " + response[i].localAddress;
                        if(response[i].tapaName == ''){
                            var label = j + ". " + response[i].localName + " - " + response[i].localAddress;
                        }else{
                            var label = j + ". " + response[i].localName + " - " + response[i].localAddress + "<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + response[i].tapaName;
                        }
                        // create the marker
                        var marker = createMarker(point,label,html);
                        map.addOverlay(marker);

                        // ==== Each time a point is found, extent the bounds ato include it =====
                        bounds.extend(point);

                    }

                    document.getElementById("side_bar").innerHTML = side_bar_html;
                    map.setZoom(map.getBoundsZoomLevel(bounds));
                    map.setCenter(bounds.getCenter());
                }

           });
       }
   });

当我在MOZILLA或GCHROME中浏览它时，它说功能openInsideMap（i）{IS NOT DEFINED openInsideMap未定义

非常感谢你的帮助，和检查它的链接是： http://www.gsi.dec.usc.es/santiagoetapas/testStage.php

Answer 1

openInsideMap仅在启动的匿名函数中定义：

function(data){
                response = jQuery.parseJSON(data);

您可以使用事件侦听器而不是JavaScript URL来解决此问题。例如，假设document.getElementById("side_bar")最初没有孩子：

function createMarker(point,name,html) {
                        var marker = new GMarker(point);
                        GEvent.addListener(marker, "click", function() {
                          marker.openInfoWindowHtml(html);
                        });
                        gmarkers[i] = marker;
                        htmls[i] = html;
                        var newLink = document.createElement("a");
                        newLink.addEventListener("click", 
                       (function(i)
                       {
                         return function()
                         {
                           openInsideMap(i);
                         };
                       })(i), false);
                       document.getElementById("side_bar").appendChild(newLink);
                        return marker;
                        //
                     }

现在openInsideMap将被关闭。匿名函数是必需的，因此您并不总是获得最新的i。

然后删除：

document.getElementById("side_bar").innerHTML = side_bar_html;

Answer 2

非常感谢马修，我尝试了你告诉我的内容，但它没有用，所以我在javascript中读了一些关于全局和局部变量的内容，然后我解决了这个问题，首先，取出：

$（文件）。就绪

然后，我把函数openInsideMap（i）;在ajax之外，并将此函数中使用的变量放在ajax之外

var gmarkers = [];
var htmls = [];

它工作得很好。您可以通过链接检查：www.gsi.dec.usc.es/santiagoetapas/testStage.php

在谷歌地图javascript点击功能不起作用

2 个答案: