我通过在php中查询数据库,然后将数据发送到addMarker函数,为googlemap构建了标记。
对于每个标记,有0到未知数量的“违规”。我已将每个标记的违规行为放入一个数组(称为违规),并将其发送到addMarker函数。
我想做的是为每次违规提供一个链接。单击该链接时,您会看到该违规的详细信息(表格)。
表格最初是display:none。但是当你点击链接时,我希望显示屏转到阻止状态,链接消失。
我想使用jquery来完成这项任务,但是我在实现它时遇到了麻烦。
我一直在尝试使用addDomListener,但它对我不起作用 - 它会在没有明确错误消息的情况下中断页面。谁能告诉我如何正确使用addDomListener,或者我应该使用其他东西吗?
function addMarker(point, name, violations, map) {
var marker=new google.maps.Marker({
position:point,
icon:'circle.png'
});
marker.setMap(map);
var markerhtml = "";
markerhtml += "<div class='table-responsive'><table class='table-condensed'><tr><th colspan='2'>" + name + "</th></tr>";
markerhtml += "</table>";
vCount = violations.length/6; //6=number of fields per violation; vCount = number of violations
if (violations.length > 0) {
markerhtml += "<p><strong>Violation";
if (violations.length > 6) {
markerhtml += "s"; //make it 'violationS' if there are more than one violation
}
markerhtml += "</strong></p>";
for (var j=0; j<vCount; j++) {
vIncidentDate = violations[0+(j*6)];
vFineDate = violations[1+(j*6)];
vFineAmount = violations[2+(j*6)];
vLeadPermit = violations[3+(j*6)];
vViolationDescription = violations[4+(j*6)];
markerhtml += "<div class='desc' id='desc" + j + "'>" + vViolationDescription + "</div>";
var thisDesc = document.getElementById("desc"+j);
google.maps.event.addDomListener($("#thisDesc")[0], 'click',
function(){
$(thisDesc).fadeOut();
$('#tblViolations'+j).fadeIn('slow');
});
vResponse = violations[5+(j*6)];
markerhtml += "<table id='tblViolation" + j + "' class='table-responsive table-condensed tblViolation'><tr class='nDesc'><td>Incident date:</td><td>" + vIncidentDate + "</td></tr>";
markerhtml += "<tr><td>Fine date:</td><td>" + vFineDate + "</td></tr>";
markerhtml += "<tr><td>Fine amount:</td><td>" + vFineAmount;
markerhtml += "</td></tr>";
markerhtml += "<tr><td>Description:</td><td>" + vViolationDescription + "</td></tr>";
markerhtml += "<tr><td>Response:</td><td>" + vResponse + "</td></tr>";
}
markerhtml += "</table></div>";
}
google.maps.event.addListener(marker, 'click', function() {
currentCenter=map.getCenter();
infowindow.setContent(markerhtml);
infowindow.setPosition(point);
infowindow.open(map);
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
map.setCenter(new google.maps.LatLng(41.0342375, -77.3066405));
});
答案 0 :(得分:4)
看起来是$(“#thisDesc”)[0]在infowindow中寻找元素的问题。这将不存在于DOM中,并且可以在infowindow'domready'事件触发之后找到。将您的JQuery代码放在infowindows'domready'事件上运行的函数中。
google.maps.event.addListener(infowindow, 'domready', function() {
// code here
});