-1
フォームを送信した後、GoogleマップのApiがユーザーの住所を表示したいが、送信後にマップがリセットされる。フォームから情報を入力するにはどうすればよいですか（情報がフォームから消えてしまう）、Google APIにその場所が表示されるようにしますか？ここでGoogle Maps APIフォームを送信すると住所が表示されなくなるまで
は私のコードです：
var User = function User (name, address, email, phone, website) {
this.name = name;
this.address = address;
this.email = email;
this.phone = phone;
this.website = website;
return this;
};
var myStorage = window.localStorage;
$(document).ready(function() {
$("#form").submit(function() {
var inputs = $("#form :input");
var values = [];
inputs.each(function() {
values.push($(this).val());
});
var name = values[0];
var address = values[1];
var email = values[2];
var phone = values[3];
var website = values[4];
var user = new User(name, address, email, phone, website);
myStorage.setItem(email, user);
});
});#calculator {
width: 310px;
height: 360px;
margin: 10px auto;
padding: 5px;
background-color: #999;
border: 3px solid black;
border-radius: 10px;
text-decoration: none;
}
#total {
\t height: 70px;
width: 300px;
display: block;
margin:auto;
background-color:white;
margin-bottom: 5px;
text-align: right;
font-size: 60px;
padding: 0 5px;
white-space:nowrap;
overflow:auto;
}
input {
width: 60px;
height: 45px;
padding: auto;
margin: 5px 6px;
text-align: center;
border-radius: 10px;
font-size: 40px;
vertical-align: middle;
word-wrap: break-word;
}
#equals {
\t width: 215px;
}
#clearall {
\t font-size: 30px;
}<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script language="JavaScript" type="text/javascript" src="./../Controller/main.js"></script>
<script language="JavaScript" type="text/javascript" src="./../Model/User.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCv7cEqzgOMNus_dXIMf98XvWBFtY5-W4o&libraries=geometry">
</script>
</head>
<body onload="initialize()">
<div id="context">
<div id="inputform">
<form id="form" >
<label><b>Name:</b></label><input type="text" name="name" autofocus required>
<label><b>Address:</b></label><input type="text" id="address" name="address" required>
<label><b>Email:</b></label><input type="email" name="email" required>
<label><b>Phone:</b></label><input type="tel" name="phone" required>
<label><b>Website:</b></label><input type="url" name="website" required>
<input type="submit" value="Submit" id="submit" onclick="codeAddress()" >
</form>
</div>
<div id="map">
</div>
</div>
<script>
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var mapOptions = {
zoom: 8,
center: latlng
}
map = new google.maps.Map(document.getElementById('map'), mapOptions);
}
function codeAddress() {
var addressId = document.getElementById('address').value;
geocoder.geocode({ 'address': addressId}, function(results, status) {
if (status == 'OK') {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
}
</script>
</body>
</html>フォームが送信し、我々は情報を持った後、図示しないが、それだけのために表示されるまで、私はまた、非表示にするGoogle MapsのAPIをしたいです2番目の分数。誰も助けることができますか？
私は投稿のコードでJavaScriptのエラーを取得し、[MCVE]あなたの問題を示している提供してください。 – geocodezip
ユーザーエンティティを追加するのを忘れました。コードは今すぐ実行する必要があります。 –