Uncaught TypeError：Laravel 5.3を使用して未定義のプロパティ 'event'を読み取ることができません。

Question

laravelを初めて使用しています。これは私のスクリプトコードです。私はこのスクリプトを使用して、入力フィールドの場所を取得しています。

<script type="text/javascript"> 


     google.maps.event.addDomListener(window, 'load', function() { 
     var places = new google.maps.places.Autocomplete(document.getElementById('job_location')); 
     google.maps.event.addListener(places, 'place_changed', function() { 
      var place = places.getPlace(); 
      var address = place.formatted_address; 
      var latitude = place.geometry.location.A; 
      var longitude = place.geometry.location.F; 
      var mesg = "Address: " + address; 
      mesg += "\nLatitude: " + latitude; 
      mesg += "\nLongitude: " + longitude; 
      $('#latitude').val(latitude); 
      $('#longitude').val(longitude); 
      // alert(mesg); 
     }); 
    }); 

私を導いてください私の中ではフェイルド名が "job_location" で置くしかしコンソールで、私はこの

 (index):586 Uncaught TypeError: Cannot read property 'event' of undefined 

のようなエラーが発生しています。

Answer 1

ご入力テキストフェイルドでGoogleマップ検索の使い方

あなたのウェブaplication
1. ため
2. Generae APIキーを使用すると、場所にアセスする必要がID =「myAddressは」blade.phpの終わりに

3. ペースト、次のコードのようなあなたのテキストフェイルドにIDを与える

   <script> 
       function initialize() { 
   
       var input = document.getElementById('myAddress'); 
       var autocomplete = new google.maps.places.Autocomplete(input); 
       } 
   
   google.maps.event.addDomListener(window, 'load', initialize); 
       </script> 
   

は「（@yieldに」あなたはmain.blade.phpに

<script src="js/jquery.min.js"></script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=Your key here &libraries=places" 
     async defer></script> 
    <script> 
    function initMap(){} 
    </script> 

5. はあなたの中には、jQueryのファイルが含まれている場合、タグにmycase main.blade.php内のレイアウトファイルにこれらの行を追加します。 page_scripts '）削除してください。 お楽しみください:)

Answer 2

Googleのオートコンプリート動作するコードを確認してください：このためここでは

 <label for="searchTextField">Please Insert an address:</label> 
     <br> 
     <input id="searchTextField" type="text" size="50"> 

    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script> 

    <script> 

     var input = document.getElementById('searchTextField'); 
var options = { 
    componentRestrictions: { 
     geocode:[] 
    } 
}; 

var autocomplete = new google.maps.places.Autocomplete(input, options); 

google.maps.event.addListener(autocomplete, 'place_changed', function() { 

    var place = autocomplete.getPlace(); 
    var lat = place.geometry.location.lat(); 
    var long = place.geometry.location.lng(); 
    alert(lat + ", " + long); 

}); 

</script> 

を働いているリンク：

http://jsfiddle.net/uxvMF/39/

おかげ