这是代码。它使用Google Maps API V3。在Mac和PC上的所有浏览器上都能很好地工作，除了Internet Explorer 9.我检查了流浪逗号和一些其他常见的IE兼容性问题，但我很难过。任何帮助表示赞赏。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
<title>Patient Wait Times for Hospitals and Clinics</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="Live Wait Times for Hospitals and Clinics. Real-time updates. Patient satisfaction and emergency room wait time data for more than 5,000 hospitals and clinics. Identify hospital with highest patient satisfaction and shortest wait time." />
<link href="stat.css" rel="stylesheet" type="text/css" /><!--Google Tracking Script -->
<script type="text/javascript">
//<![CDATA[
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-31929746-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
<!--
// create the XMLHttpRequest object, according browser
function get_XmlHttp() {
// create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
var xmlHttp = null;
if(window.XMLHttpRequest) { // for Forefox, IE7+, Opera, Safari, ...
xmlHttp = new XMLHttpRequest();
}
else if(window.ActiveXObject) { // for Internet Explorer 5 or 6
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlHttp;
}
// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID) {
var request = get_XmlHttp(); // call the function for the XMLHttpRequest instance
// create pairs index=value with data that must be sent to server
var the_data = 'test='+document.getElementById('addressInput').innerHTML;
request.open("POST", php_file, true); // set the request
// adds a header to tell the PHP script to recognize the data as is sent via POST
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(the_data); // calls the send() method with datas as parameter
// Check request status
// If the response is received completely, will be transferred to the HTML tag with tagID
request.onreadystatechange = function() {
if (request.readyState == 4) {
document.getElementById(tagID).innerHTML = request.responseText;
}
}
}
//]]>
</script>
<style type="text/css">
/*<![CDATA[*/
<!--
BODY
{
padding-left: 50px;
padding-right: 50px;
font-size:14px;
</body>
}
-->
/*]]>*/
</style>
<script src="http://maps.google.com/maps?file=api&v=2&key=AIzaSyDAB1Q6VnjM9eLivEdelHRuXIzvFeSdvXo" type="text/javascript">
</script>
<script type="text/javascript">
//<![CDATA[
var map;
var geocoder;
function load() {
if (GBrowserIsCompatible()) {
geocoder = new GClientGeocoder();
map = new GMap2(document.getElementById('map'));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(40, -100), 4);
}
}
function searchLocations() {
var address = document.getElementById('addressInput').value;
// window.location.href = "capture.php?var=" + address;
geocoder.getLatLng(address, function(latlng) {
if (!latlng) {
alert(address + ' not found');
} else {
searchLocationsNear(latlng);
}
});
}
//function OnUnload() {
//var address = document.getElementById('addressInput').value;
// window.location.href = "capture.php?var=" + address;
//alert(address);
//}
//function OnUnload() {
//var address = document.getElementById('addressInput').value;
//window.location.href = "capture.php?var=" + address;
//alert ("The current document will be unloaded!");
//}
// create the XMLHttpRequest object, according browser
function get_XmlHttp() {
// create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
var xmlHttp = null;
if(window.XMLHttpRequest) { // for Forefox, IE7+, Opera, Safari, ...
xmlHttp = new XMLHttpRequest();
}
else if(window.ActiveXObject) { // for Internet Explorer 5 or 6
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlHttp;
}
// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID) {
var request = get_XmlHttp(); // calls the function for the XMLHttpRequest instance
// gets data from form fields, using their ID
var box = document.getElementById('addressInput').value;
//var mesaj = document.getElementById('mesaj').value;
// create pairs index=value with data that must be sent to server
var the_data = 'box='+box;
request.open("POST", php_file, true); // sets the request
// adds a header to tell the PHP script to recognize the data as is sent via POST
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(the_data); // sends the request
// Check request status
// If the response is received completely, will be transferred to the HTML tag with tagID
request.onreadystatechange = function() {
if (request.readyState == 4) {
document.getElementById(tagID).innerHTML = request.responseText;
}
}
}
function searchLocationsNear(center) {
var radius = document.getElementById('radiusSelect').value;
var searchUrl = 'phpsqlsearch_genxml2.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
//var searchUrl = 'phpsqlsearch_genxml2.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius + '&address=' + address;
GDownloadUrl(searchUrl, function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName('marker');
map.clearOverlays();
var sidebar = document.getElementById('sidebar');
sidebar.innerHTML = '';
if (markers.length == 0) {
sidebar.innerHTML = 'No results found.';
map.setCenter(new GLatLng(40, -100), 4);
return;
}
var bounds = new GLatLngBounds();
for (var i = 0; i < markers.length; i++) {
var ID = markers[i].getAttribute('ID');
var name = markers[i].getAttribute('name');
// var address = markers[i].getAttribute('address');
var street = markers[i].getAttribute('street');
var city = markers[i].getAttribute('city');
var wait = markers[i].getAttribute('wait');
var collected = markers[i].getAttribute('collected');
var min = markers[i].getAttribute('min');
var sat = markers[i].getAttribute('sat');
var nps = markers[i].getAttribute('nps');
var score = markers[i].getAttribute('score');
var distance = parseFloat(markers[i].getAttribute('distance'));
var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
parseFloat(markers[i].getAttribute('lng')));
//var d = new Date('collected');
//var e = dateFormat('collected', "dddd, mmmm dS, yyyy, h:MM:ss TT");
// var marker = createMarker(point, name, address, wait);
var marker = createMarker(point, name, street, city, wait, collected, distance, min, nps, score);
map.addOverlay(marker);
// var sidebarEntry = createSidebarEntry(marker, name, address, wait, distance);
var sidebarEntry = createSidebarEntry(marker, name, street, city, wait, distance, collected, min, nps, score);
sidebar.appendChild(sidebarEntry);
bounds.extend(point);
}
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
});
}
function createMarker(point, name, street, city, wait, collected, distance, min, nps) {
var marker = new GMarker(point);
//var html = '<b>' + name + '<\/b> <br/>' + address + '<br/>' + wait +' minutes';
var html = '<b>' + name + '<\/b> <br/>' + street + ', '+ city + '<br/>' + 'Wait Time: ' + wait + ' ' + min + '<br/>' + 'Updated: '
+ collected + '<br/>' +'Distance: ' + distance.toFixed(1) + ' miles' + '<br/>';
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
return marker;
}
function createSidebarEntry(marker, name, street, city, wait, distance, collected, min, nps, score) {
var div = document.createElement('div');
// var html = '<b>' + name + '<\/b> ' + distance.toFixed(1) + ' miles <br/>' + address + '<br/>' + wait +' minutes';
//var html = '<b>' + name + '<\/b> ' + distance.toFixed(1) + ' miles <br/>' + street + ', ' + city + '<br/>' + wait +' minutes';
var html = '<span class="sidefont">' + '<b>' + name + '<\/b>' + '<br/>' + ' GovRank: ' + score + '<br/>' +
' Wait Time: ' + '<font color=#336FF>' + wait + ' ' + min + '<br/>' + '<\/font>' +
' ' + '<font size="-5"><i>' + 'Updated ' + collected + ' pt' + '<\/i><\/font>' + '<\/span>';
div.innerHTML = html;
div.style.cursor = 'pointer';
div.style.marginBottom = '5px';
GEvent.addDomListener(div, 'click', function() {
GEvent.trigger(marker, 'click');
});
GEvent.addDomListener(div, 'mouseover', function() {
// div.style.backgroundColor = '#eee';
div.style.backgroundColor = '#3366FF';
});
GEvent.addDomListener(div, 'mouseout', function() {
div.style.backgroundColor = '#fff';
});
return div;
}
//]]>
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Header</title>
<link href="stat.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Footer</title>
<link href="stat.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/*<![CDATA[*/
span.c4 {color: #093}
div.c3 {color: #000; font-size: 14px; height: 450px; overflow: auto; text-align: left; width: 350px}
div.c2 {height: 450px; overflow: hidden; text-align: left; width: 600px}
div.c1 {font-family: Arial, sans-serif; font-size: 11px; text-align: left; width: 600px}
/*]]>*/
</style>
</head>
<!--script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script-->
<!--script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDAB1Q6VnjM9eLivEdelHRuXIzvFeSdvXo&sensor=true">
</script-->
<!--script type="text/javascript" src=""></script-->
<!--body onload="load()" onunload="OnUnload()"-->
<body onload="load()">
<div class="story"><!--p class="basic-paragraph"><!==body onload="load()" onunload="GUnload(); Capture();"--></div>
<div id="context"></div>
<div class="c1"></div>
<table align="left">
<tr>
<td>
<table align="left">
<tr>
<td valign="bottom">
<table align="left">
<tr>
<td valign="bottom"><span class="no-style-override-2">W</span><span class="no-style-override-3">AIT</span><span class="no-style-override-2">H
</span><span class="no-style-override-3">EALTH.COM</span></td>
</tr>
<tr>
<td valign="bottom"><span class="no-style-override-4">Compare Government Rankings and Patient Wait Times at Hospitals</span></td>
</tr>
<!--tr><td width="600px"><hr align=left noshade size=2 width=80% color=#b4b4b4></td></tr--></table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td><!--form action="test_form.php" method="post" name="form1" onsubmit="searchLocations(); ajaxrequest('test_form.php', 'resp'); return false;"-->
<div id="resp"></div>
<form action="capture_search.php" method="post" name="form1" id="form1"></form>
<table align="left">
<tr align="top">
<td><span class="no-style-override-9">Enter Hospital Name, City, or Zip</span></td>
<td><span class="no-style-override-9"> Search Radius</span></td>
</tr>
<tr>
<td valign="bottom"><input type="text" id="addressInput" size="20" /></td>
<td valign="bottom"><select id="radiusSelect">
<option value="10" selected="selected">10 miles</option>
<option value="5">5 miles</option>
<option value="20">20 miles</option>
</select></td>
<td valign="bottom"><input type="submit" onclick="searchLocations(); ajaxrequest('capture_search.php', 'resp'); return false;" onkeypress="this.onclick()"
value="Find Hospitals" /></td>
<!--td valign="bottom"><input type="text" onkeypress="searchLocations(); OnUnload();"/></td--></tr>
</table>
<!--/form--></td>
</tr>
<!--/table-->
<tr>
<td>
<table align="left" border="1"><!--tr><td colspan="1"><hr align=left noshade size=2 width=160% color="#FF0000"></td></tr-->
<!--tbody--><!--Map-->
<tr>
<td align="left">
<div id="map" class="c2"></div>
</td>
<!--list of places on map -->
<td align="left">
<div id="sidebar" class="c3">Detailed results will appear here.</div>
</td>
</tr>
<!--/tbody--></table>
<div>
<table>
<tr>
<td>
<table align="left">
<tr>
<td>
<table align="left"><!--tr><td> </td><td> </td><td> </td><td> </td></tr-->
<!--tr><td width="600px"><hr align=left noshade size=2 width=80% color=#b4b4b4></td></tr-->
<tr>
<td align="left">
<div id="footer"><span class="no-style-override-5"><a href="index.php">Home</a> | <a href="about.php">About</a> | <a href="contact.php">Contact</a> | <a href="display_wait.php">Show All</a> | <a href="grade.php">GovRank</a> | <a href="search_ratings.php"><span class="c4">Rate a Hospital</span></a></span></div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--script type="text/javascript">
//var x="one";
window.location.href = "http://www.capture.php?var=" + address;
</script--></td>
</tr>
</table>
</body>
</html>
答案 0 :(得分：1)
不推荐使用v2 API，不再受到积极支持。虽然FAQ说IE6 +：
Google Maps JavaScript API V2：
- IE 6.0+（Windows）
- Firefox 2.0+（Windows，Mac OS X，Linux）
- Safari 3.1+（Mac OS X，iOS）
- Chrome（Windows）
我怀疑是否正在努力支持新版IE的怪癖。