-1

私は Javasricpt が初めてで、Google Maps API を使用してアプリケーションを開発しています。onclick イベントから JavaScript 関数を呼び出そうとしていますが、呼び出されていません。誰かがエラーや私が見逃しているものを見たら教えてください、私は感謝します. 以下は私のコードです。

これはJavaScriptコードです：

 <script>
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
var Center=new google.maps.LatLng(18.210885,-67.140884);

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var properties = {
    center:Center,
    zoom:18,
    mapTypeId:google.maps.MapTypeId.SATELLITE
  };
  map=new google.maps.Map(document.getElementById("map"), properties);
  directionsDisplay.setMap(map);
  }
function makeRoute() {
    var start = new google.maps.LatLng(18.210885,-67.140884);
    var end =new google.maps.LatLng(18.2098150,-67.1418260);
    var request = {
      origin:start,
      destination:end,
      travelMode: google.maps.TravelMode.WALKING
      };

    directionsService.route(request, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(result);
    } else { alert("couldn't get directions:"+status); }
    });
}

</script>

これは私のフォームです：

 <form method="post" action="">
          <table border="0px" style="border-radius:5px; border-color: #888888; background-color: #FFFFFF; box-shadow: 5px 5px 5px #888888;"><tr>
          <td><b>Get directions:</b></font><br/></td>
          </tr><tr><td align="right">Building:</td><td>
            <select name="building">
              <option value="#" default >Select</option>
              <option value="monzon">Monzon</option>
            </select></td></tr><tr>
          <td align="right">Room:</td>
          <td><input type="text" name="room" placeholder="eg. 208B / CH 116" ></td>
          </tr><tr><td></td>
          <td align="right" ><input id="submit" type="submit" value="submit" onclick="makeRoute()"></td></tr></table>
        </form>
4

1 に答える 1

0

実施例

ここで false を返す必要があります。

<td align="right" ><input id="submit" type="submit" value="submit" onclick="makeRoute(); return false;"></td></tr></table>

ページがリロードされて空のマップが表示されるのを防ぐため。

于 2013-02-02T21:04:42.147 に答える