带有 turbolinks 和窗口负载的 rails 4

Question

我正在使用 Rails 4。

我正在尝试使用此脚本来显示谷歌地图。我有一个不同地方的页面，每个地方都有一个地址。它显示在谷歌地图中。
所以我使用分页，在每一页上我有 4 个地方。 4 个 gmap 脚本。
但是这个脚本只在页面重新加载（ctrl+R 或 F5）时初始化，这是因为 turbolinks。

我怎样才能让它以最简单的方式工作？

<script>
  function initialize() {
    var myLatlng = new google.maps.LatLng(<%= place.latitude %>, <%= place.longitude %>); 
    var mapOptions = {
      zoom: 16,
      center: myLatlng
    };
    var map = new google.maps.Map(
      document.getElementById("map-canvas-<%= place.id %>"),
      mapOptions);
    var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: '<%= place.title %>'
    });
  }

  google.maps.event.addDomListener(window, 'load', initialize);
</script>

这就是脚本。每个地图的 div 看起来像这样：

<div id="map-canvas-<%= place.id %>"></div>

Answer 1

您需要通过 turbolink 初始化脚本。检查this ASCIIcast turbolinks。

一般来说，你需要改变...

jQuery(function() {
  # your script
});

...到...

var ready;
ready = function() {
  # your script
};

$(document).ready(ready);
$(document).on('page:load', ready);

您可以找到here 的所有 turbo 链接事件。

Turbolinks 5 更新

page:load 已更改为 turbolinks:load，因此您想改为：

var ready;
ready = function() {
  # your script
};

$(document).on('turbolinks:load', ready);

您不再需要像 turbolinks:load 那样指定 $(document).ready();。欲了解更多信息，请查看README。