Google Appsのスクリプトは、距離行列URLが正しく

を形成していないアプリの全体的なポイントは、HTML inputs.Theによって定義された2つのアドレス間の距離を計算して表示することで、私が遭遇しています問題はCalculateボタンがクリックされたとき、それは新しいを開いています私は推測している奇妙なURLを持つタブ、「https://n-u3xjzi7wklp272w6mwu2e3jc3umixhe6rym5h7i-0lu-script.googleusercontent.com/userCodeAppPanel?origin=&destination=は」変なURLがorigin=&destination=が含まれているため、実際の距離行列リクエストURLことになっているが、私は間違いなく間違っている可能性があります。Google Appsのスクリプトは、距離行列URLが正しく

<!DOCTYPE html> 
<html> 
    <head> 
    <base target="_top"> 
    </head> 
    <body> 
    <h2>Distance Between two Addresses</h2> 
<form id="distance_form"> 
    <label>Origin: </label> 
    <input id="origin" type="text" name="origin"/> 
    <br/> 
    <label>Destination: </label> 
    <input id="destination" type="text" name="destination"/> 
    <br/> 
    <input type="submit" value="Calculate"/> 
</form> 
<div id="result"> 
</div> 
    </body> 

    <script> 

$(function() { 

    function calculateDistance(origin, destination) { 
    var service = new google.maps.DistanceMatrixService(); 
    service.getDistanceMatrix(
    { 
     origins: [origin], 
     destinations: [destination], 
     travelMode: google.maps.TravelMode.DRIVING, 
     unitSystem: google.maps.UnitSystem.IMPERIAL, 
     avoidHighways: false, 
     avoidTolls: false 
    }, callback); 
    } 

    function callback(response, status) { 
    if (status != google.maps.DistanceMatrixStatus.OK) { 
     $('#result').html(err); 
    } else { 
     var origin = response.originAddresses[0]; 
     var destination = response.destinationAddresses[0]; 
     if (response.rows[0].elements[0].status === "ZERO_RESULTS") { 
     $('#result').html("Better get on a plane. There are no roads between " 
          + origin + " and " + destination); 
     } else { 
     var distance = response.rows[0].elements[0].distance; 
     var distance_value = distance.value; 
     var distance_text = distance.text; 
     var miles = distance_text.substring(0, distance_text.length - 3); 
     $('#result').html("It is " + miles + " miles from " + origin + " to " + destination); 
     } 
    } 
    } 

    $('#distance_form').submit(function(){ 

     var origin = $('#origin').val(); 
     var destination = $('#destination').val(); 
     var distance_text = calculateDistance(origin, destination); 
    }); 

}); 

    </script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAxmrFQipNODQwlv57BHQxati2jR8_xWdA" async defer></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 


</html>

出典

2017-07-05 Rick James

フォーム送信のデフォルトの動作は、AppsスクリプトのWebアプリで奇妙なURLを引き起こすものである新しいページを開くには、次のとおりです。

は、ここに私の現在のコードです。

<script> 

    function preventFormSubmit() { 

    var forms = document.querySelectorAll('form') 

    for (var i = 0; i < forms.length; i++) {  
     forms[i].addEventListener('submit', function(event) { 
     event.preventDefault() 
     }) 
    } 

    } // preventFormSubmit() 

    window.addEventListener('load', preventFormSubmit) 

</script>

：あなたは、あなたのHTMLのに次を追加することで、これをオフにすることができます

出典

2017-07-05 08:59:56

Google Appsのスクリプトは、距離行列URLが正しく

答えて

関連する問題