Rails應用程序中的Google地方信息自動填充功能不可靠

我在我的Rails應用中使用Google Places API進行自動填充，但我無法每次都使用它。每次載入表單所在的頁面時，就像一個骰子一樣：有時候JS會起作用，有時卻不起作用。Rails應用程序中的Google地方信息自動填充功能不可靠

順便說一句，我有幾個其他的JavaScript也有時無法工作，但谷歌自動完成的那些是最古怪的，他們是任務關鍵。

下面是設置：

1°我的HTML標題有：

<%= javascript_include_tag "application", "data-turbolinks-track" => true %> 
<%= yield :javascript_includes %>

然後在我的身上，我有content_for標籤粘貼在頭部

<% content_for :javascript_includes do %> 
    <%= javascript_include_tag "application", "https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places" %> 

    <script type="text/javascript"> 
    function initializeAutocomplete(){ 
     var input = document.getElementById('offer_location'); 
     var options = { 
     types: ['(cities)'] 
     }; 

     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 lng = place.geometry.location.lng(); 
     $('#offer_latitude').val(lat) 
     $('#offer_longitude').val(lng) 
     }); 
    } 
    google.maps.event.addDomListener(window, 'load', initializeAutocomplete); 
    </script> 
<% end %>

產生我曾經在一個單獨的.js文件中使用initializeAutocomplete腳本，該文件通過資產管道加載，但得到了類似的結果：自動完成工作的時間僅爲t他的時間...（其實我覺得它失敗的更經常）

我認爲這個問題與何時加載不同的元素以及何時觸發回調有關。這裏是的東西例子我試圖改變：

使用$(window).load和$(document).ready代替addDomListener(window, 'load', initializeAutocomplete)
把腳本在資產管道（加載單獨google-autocomplete.js文件意味着它被載入前鏈接到content_for標記中提供的API
將腳本放在單獨的google-autocomplete.js文件中，該文件不包含在資產管道中，並在API鏈接之後立即調用標籤content_for標籤

非常感謝您的幫助！

- 編輯 -

在事實證明，這是turbolinks搞亂了我的jQuery的觸發器，特別是一個爲谷歌自動完成結束。找到答案there與我固定所有我的JS。

來源

2014-09-05 user3778624

我有同樣的問題 - 這個工作對我來說http://ubilabs.github.io/geocomplete/examples/simple.html – 2014-09-05 11:44:28

待辦事項你知道它究竟做了什麼？ – user3778624 2014-09-05 15:10:47

您在項目中使用Turbolinks嗎？如果您的腳本在第一次加載頁面時起作用，但是當您使用網站中其他頁面的鏈接導航到該腳本時，則可能是因爲Turbolinks！ – 2014-09-08 13:00:51

不知道這是否解決了您的實際錯誤，但嘗試調用函數與$(function() {initializeAutocomplete()}); - 這是$(document).ready(function(){

一個整潔的替代我會設置它就像這樣：

<% content_for :javascript_includes do %> 
    <%= javascript_include_tag "application", "https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places" %> 

    <script type="text/javascript"> 
    function initializeAutocomplete(){ 
     var input = document.getElementById('offer_location'); 
     var options = { 
     types: ['(cities)'] 
     }; 

     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 lng = place.geometry.location.lng(); 
     $('#offer_latitude').val(lat) 
     $('#offer_longitude').val(lng) 
     }); 
    } 
    $(function() { 
     initializeAutocomplete(); 
    }); 
    </script> 
<% end %>

所以你定義函數，然後等待dom完成加載。

這並不能解釋它爲什麼有時會起作用，而不是其他人。我會通過從功能記錄東西進行調查console.log()

來源

2014-09-05 11:03:23

我試着與你建議的聽衆。它似乎更好，但仍不是每次。當它在第一次加載頁面失敗時，它通常會在我刷新時起作用。這是否給你任何想法，問題來自哪裏？ – user3778624 2014-09-05 15:07:54

不是真的沒有。嘗試沿着登錄路線走。 – 2014-09-05 15:43:28

它可能是一個呈現/加載問題。

試試這個......

<%= javascript_include_tag "https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=place", async: => true, :defer => true %>

在這裏閱讀更多...

Script Tag - async & defer

來源

2015-12-15 10:14:20 icalvete

Rails應用程序中的Google地方信息自動填充功能不可靠

回答

相關問題