2013-04-23 33 views
-1

按以下链接我想有谷歌地图与用户能够点击地图可以指定一个位置,但我只看到一个空白屏幕: https://developers.google.com/maps/articles/phpsqlinfo_v3看到与谷歌空白页地图API

我在这里做了一些改变按链接,但它并没有改变: webview for google maps v3 shows blank screen

错误从谷歌浏览器控制台如下: 未捕获的SyntaxError:意外的标记< phpsqlinfo_add.html:33 未捕获的ReferenceError:初始化没有定义phpsqlinfo_add。 html:123

适当的线下方突出了代码:

<!DOCTYPE html> 
<!-- 
Copyright 2008 Google Inc. 
Licensed under the Apache License, Version 2.0: 
http://www.apache.org/licenses/LICENSE-2.0 
--> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Saving User-Added Form Data Example</title> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 
    var marker; 
    var infowindow; 

    function initialize() { 
     var latlng = new google.maps.LatLng(37.4419, -122.1419); 
     var options = { 
     zoom: 13, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 

     google.maps.event.addDomListener(window, 'load', initialize); 
     var map = new google.maps.Map(document.getElementById("map_canvas"), options); 
     var html = "<table>" + 
       "<tr><td>Name:</td> <td><input type='text' id='name'/> </td> </tr>" + 
       "<tr><td>Email:</td> <td><input type='text' id='email'/></td> </tr>" + 
       "<tr><td>Phone:</td> <td><input type='text' id='phone'/></td> </tr>" + 
       "<tr><td>Town:</td> <td><input type='text' id='town'/></td> </tr>" + 
       "<tr><td>County:</td> <td><select id='county'>" + 
       **<option value='Outside Ireland' SELECTED>OutsideIreland</option> +** 
       <option value='Antrim' SELECTED>Antrim</option> + 
       <option value='Armagh' SELECTED>Armagh</option> + 
       <option value='Carlow' SELECTED>Carlow</option> + 
       <option value='Cavan' SELECTED>Cavan</option> + 
       <option value='Clare' SELECTED>Clare</option> + 
       <option value='Cork' SELECTED>Cork</option> + 
       <option value='Derry' SELECTED>Derry</option> + 
       <option value='Donegal' SELECTED>Donegal</option> + 
       <option value='Down' SELECTED>Down</option> + 
       <option value='Dublin' SELECTED>Dublin</option> + 
       <option value='Fermanagh' SELECTED>Fermanagh</option> + 
       <option value='Galway' SELECTED>Galway</option> + 
       <option value='Kerry' SELECTED>Kerry</option> + 
       <option value='Kildare' SELECTED>Kildare</option> + 
       <option value='Kilkenny' SELECTED>Kilkenny</option> + 
       <option value='Laois' SELECTED>Laois</option> + 
       <option value='Leitrim' SELECTED>Leitrim</option> + 
       <option value='Limerick' SELECTED>Limerick</option> + 
       <option value='Longford' SELECTED>Longford</option> + 
       <option value='Louth' SELECTED>Louth</option> + 
       <option value='Mayo' SELECTED>Mayo</option> + 
       <option value='Meath' SELECTED>Meath</option> + 
       <option value='Monaghan' SELECTED>Monaghan</option> + 
       <option value='Offaly' SELECTED>Offaly</option> + 
       <option value='Roscommon' SELECTED>Roscommon</option> + 
       <option value='Sligo' SELECTED>Sligo</option> + 
       <option value='Tipperary' SELECTED>Tipperary</option> + 
       <option value='Tyrone' SELECTED>Tyrone</option> + 
       <option value='Waterford' SELECTED>Waterford</option> + 
       <option value='Westmeath' SELECTED>Westmeath</option> + 
       <option value='Wexford' SELECTED>Wexford</option> + 
       <option value='Wicklow' SELECTED>Wicklow</option> + 
       "</select> </td></tr>" + 
       "<tr><td>Name of Location:</td> <td><input type='text' id='location'/></td> </tr>" + 
       "<tr><td></td><td><input type='button' value='Save & Close' onclick='saveData()'/></td></tr>"; 

    infowindow = new google.maps.InfoWindow({ 
    content: html 
    }); 

    google.maps.event.addListener(map, "click", function(event) { 
     marker = new google.maps.Marker({ 
      position: event.latLng, 
      map: map 
     }); 
     google.maps.event.addListener(marker, "click", function() { 
      infowindow.open(map, marker); 
     }); 
    }); 
    } 

    function saveData() { 
     var name = escape(document.getElementById("name").value); 
     var address = escape(document.getElementById("address").value); 
     var type = document.getElementById("type").value; 
     var latlng = marker.getPosition(); 

     var url = "phpsqlinfo_addrow.php?name=" + name + "&address=" + address + 
       "&type=" + type + "&lat=" + latlng.lat() + "&lng=" + latlng.lng(); 
     downloadUrl(url, function(data, responseCode) { 
     if (responseCode == 200 && data.length <= 1) { 
      infowindow.close(); 
      document.getElementById("message").innerHTML = "Location added."; 
     } 
     }); 
    } 

    function downloadUrl(url, callback) { 
     var request = window.ActiveXObject ? 
      new ActiveXObject('Microsoft.XMLHTTP') : 
      new XMLHttpRequest; 

     request.onreadystatechange = function() { 
     if (request.readyState == 4) { 
      request.onreadystatechange = doNothing; 
      callback(request.responseText, request.status); 
     } 
     }; 

     request.open('GET', url, true); 
     request.send(null); 
    } 

    function doNothing() {} 
    </script> 
    </head> 

    <body> 
    <div id="map_canvas" style="height: 100px; width=100px;"></div> 
    **<script type="text/javascript">initialize();</script>** 
</body> 
    <!-- Commenting out line to edit suggestion from stackoverflow 
    <body style="margin:0px; padding:0px;" onload="initialize()"> 
    <div id="map_canvas" style="width: 500px; height: 300px"></div> 
    <div id="message"></div> 
    </body> --> 
</html> 
+0

你的评论之一是正确的,没有电话初始化() – sandy 2013-04-23 12:16:48

+0

@sandy更改为注释初始化,但完全相同的意见,但不同的行 – 2013-04-23 12:27:47

回答

2

您有无效的语法从这里开始:

**<option value='Outside Ireland' SELECTED>OutsideIreland</option> +**

它看起来像你正在尝试来连接所有options的使用JavaScript拼接语法+。如果你走这条路线,那么你需要在你所有的options周围加双引号。

另一种方法是删除所有+,并在html var字符串开头和结尾处使用双引号。

+0

这些**只是突出显示粗体文本,但我添加了双引号我有地图显示。这很有用。谢谢。 – 2013-04-23 13:45:18