侧边栏问题 - HTML 列表的更改

Question

您好，我想知道是否有人可以帮助我，因为我已经陷入了困境，我不知道如何解决这个问题。

我正在使用 此 页面为用户提供能够选择的功能并通过复选框取消选择地图上的标记。然后，他们可以单击地图上或通过左侧边栏的任何标记，从右侧边栏的下拉菜单中选择半径设置，并在给定半径内搜索 POI。

我想做的是更改左侧侧边栏以匹配右侧侧边栏的格式。

我知道需要更改的代码是这样的：

function myclick(i) { 
            google.maps.event.trigger(gmarkers[i],"click"); 
            } 

            // == rebuilds the sidebar to match the markers currently displayed == 
            function makeSidebar() { 
            var html = ""; 
            for (var i=0; i<gmarkers.length; i++) { 
            if (gmarkers[i].getVisible()) { 
            html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + " - " + gmarkers[i].myfinds + " Finds made" + '<\/a><br>'; 
            } 
            } 
            document.getElementById("side_bar").innerHTML = html; 
            } 

我尝试将其替换为下面的代码，该代码取自在右侧创建侧边栏的脚本片段。

function createSidebarEntry(marker2, sitedescription, distance) {
    var div = document.createElement('div');
        var html2 = '<b>' + sitedescription + '</b> (' + distance.toFixed(1) + '  miles) <br/>';
    div.innerHTML = html2;
    div.style.cursor = 'pointer';
    div.style.marginBottom = '5px'; 
    google.maps.event.addDomListener(div, 'click', function() {
    google.maps.event.trigger(marker2, 'click');
    });
    google.maps.event.addDomListener(div, 'mouseover', function() {
    div.style.backgroundColor = '#eee';
    });
    google.maps.event.addDomListener(div, 'mouseout', function() {
    div.style.backgroundColor = '#fff';
    });
    return div;
    }

这就是我到目前为止所做的。我可以让标记出现在地图上，但无法渲染左侧的侧边栏。

我已经为此工作好几天了，但我似乎一直在兜圈子。我只是想知道是否有人可以看一下这个并让我知道我哪里出了问题。

非常感谢和亲切的问候

Answer 1

为什么你会惊讶它不起作用？问题出在你的函数 makeSidebar() 中，它可能应该完成这项工作（？），但正如它所写的那样，它做了一些奇怪的事情......首先你创建一个新的 div > 您不要将其放置在 dom 中的任何位置（它可能应该放置在侧边栏中，但此函数中不使用侧边栏！）。该函数执行 for 循环，但它在第一次迭代中返回！所以实际上它什么也没做。

继续调试您的代码。使用 Firebug 调试器来追踪它！