jQuery-ujs已经加载Rails。

Question

jQuery-ujs已经加载Rails。

4

我正在尝试将Google Maps集成到我的Rails应用程序中（请记住，这是我第一次这样做，我是一个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 .

奇怪，一直收到以下错误消息： Uncaught Error: jquery-ujs已经被加载！

有什么建议吗？

谢谢！

- user2805193

1

require_tree . 会加载目录树中的所有文件。 - Tomanow

您好，删除 require_tree . 没有解决这个问题。我仍然得到以下错误：未捕获的错误：jquery-ujs 已经被加载！jquery.js?body=1:517 未捕获的错误：jquery-ujs 已经被加载！jquery.js?body=1:517 未捕获的错误：jquery-ujs 已经被加载！jquery.js?body=1:517感谢您的帮助！ - user2805193

你也在使用包含该脚本的 gem 吗？ - Tomanow

我不知道。有没有办法找出来？这是我的个人宝石清单：

个人宝石

gem 'activerecord-tableless' gem 'compass-rails'，'~> 2.0.alpha.0' gem 'figaro' gem 'gibbon' gem 'google_drive' gem 'simple_form' gem 'better_errors' gem 'quiet_assets' gem "font-awesome-rails"再次感谢！ - user2805193

@HarrisRobin 你找到问题了吗？我也遇到了同样的问题。 - shajin

不，我没有解决它。最终使用了g4maps gem。 - user2805193

3个回答

3

我也遇到了这个问题，看起来@Cremz的turbolinks是正确的。我在这里找到了解决方案，简而言之，你很可能在body中加载了turbolinks，如果是的话，请将它们移到head标签中。

- oconn

这正是我的问题。谢谢！ - Ryan Drost

0

我不想触碰任何宝石或配置，因为其他一切都运作正常，所以我编写了一些 JS 代码，如果在触发 window.onpopstate 时 turbolink 对象的 restorationIdentifier 重复，则重新加载页面。

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

- Alejandro Quintero

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Cremz · Accepted Answer

我认为这可能与turbolinks有关。尝试禁用它们。我曾经在项目中遇到了很多问题，最终放弃了它们。如果您仍想尝试，请先禁用它们，您可以使用这个gem来解决问题：

https://github.com/kossnocorp/jquery.turbolinks