Question

所以我试图将谷歌地图集成到我的rails应用程序中（请记住，这是我第一次这样做，而且我是一名初学者，我不太了解Ruby代码。）

地图代码

<!-- 
    You need to include this script on any page that has a Google Map.
    When using Google Maps on your own site you MUST signup for your own API key at:
        https://developers.google.com/maps/documentation/javascript/tutorial#api_key
    After your sign up replace the key in the URL below or paste in the new script tag that Google provides.
-->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDRKcd8KX82m0q47qSGB9Ryh79jqzjOpAk&sensor=false"></script>

<script type="text/javascript">
    // When the window has finished loading create our google map below
    google.maps.event.addDomListener(window, 'load', init);

    function init() {
        // Basic options for a simple Google Map
        // For more options see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
        var mapOptions = {
            // How zoomed in you want the map to start at (always required)
            zoom: 12,

            // The latitude and longitude to center the map (always required)
            center: new google.maps.LatLng(45.495040, -73.614371), // Montreal

            // How you would like to style the map. 
            // This is where you would paste any style found on Snazzy Maps.
            styles: [{"stylers":[{"hue":"#16a085"},{"saturation":0}]},{"featureType":"road","elementType":"geometry","stylers":[{"lightness":80},{"visibility":"simplified"}]},{"featureType":"road","elementType":"labels","stylers":[{"visibility":"off"}]}]
        };
        // Get the HTML DOM element that will contain your map 
        // We are using a div with id="map" seen below in the <body>
        var mapElement = document.getElementById('map');

        // Create the Google Map using out element and options defined above
        var map = new google.maps.Map(mapElement, mapOptions);
    }
</script> </head> <body>
<!-- The element that will contain our Google Map. This is used in both the Javascript and CSS above. -->
<div class="innerborder">
          <div id="map"></div>        </div>

出于某种原因，每当我点击包含地图的页面时，它会尝试加载两次jquery-ujs。这是我的application.js包含树

// = require jquery // = require jquery_ujs // = require turbolinks // = require_tree。

很奇怪，继续这样做：未捕获错误：jquery-ujs已被加载！

对我有什么想法？

谢谢！

Answer 1

我认为这是来自turbolinks。尝试禁用它们。我和他们有很多问题，最终将他们从项目中删除。您可以使用此gem来解决问题，但如果您仍想尝试，请先禁用它们： https://github.com/kossnocorp/jquery.turbolinks

Answer 2

我也有这个问题，看起来@Cremz对于turbolinks来说是正确的。我找到了问题here的解决方案，但简而言之，你最有可能在体内加载turbolinks，如果有的话，将它们移到head标签中。

Answer 3

我不想触摸任何宝石或配置导致其他一切正常工作所以我写了一些js来重新加载页面如果在window.onpopstate触发时turbolink对象的restoreIdentifier重复

＆＃13;

$(document).on('ready',function(){
	var turbi=window.history.state.turbolinks.restorationIdentifier;
	window.onpopstate= function(){
		if(window.history.state.turbolinks.restorationIdentifier==turbi){
			window.location.reload();
		}
	}
    
    });

＆＃13;

jquery-ujs已经加载了rails

3 个答案: