Rails window.onload 的 turbolinks 问题

Question

我有 rails 带有用于图像弹出效果的 baguetteBox 库的应用程序，但它只有在页面刷新后才能正常工作。我知道这是因为 turbolinks 所以我安装了 jquery-turbolinks gem 但它仍然不起作用。 //要求 jquery.turbolinks 在正确的位置。

  //
  //= require jquery
  //= require jquery.turbolinks
  //= require jquery_ujs
  //= require baguetteBox.min
  //= require turbolinks
  //= require_tree .

我在显示视图的底部有这段代码

<script>
   window.onload = function() {
   baguetteBox.run('.step_div');
   };
</script>

初始化脚本。

有什么想法吗？

Answer 1

您需要为 turbolinks 触发稍微不同的东西：

var myFunc = function() {
  baguetteBox.run('.step_div');
};

$(document).ready(myFunc);
$(document).on('page:load', myFunc); // Classic Turbolinks
$(document).on('turbolinks:load', myFunc); // Turbolinks 5

这样，您的函数将在标准页面就绪触发器上被调用，并且当 turbolinks 将页面加载到内存而无需实际页面刷新时也会被调用。显然，您只需要为您正在使用的相应版本的 turbolinks 添加 turbolinks 事件触发器。

在这里查看由 turbolinks 5 触发的其他事件：https://github.com/turbolinks/turbolinks#full-list-of-events

对于原始的 turbolinks，文档在此处： https://github.com/rails/turbolinks/#events

Rails window.onload 的 turbolinks 问题

Rails turbolinks issues with window.onload

javascript

jquery

ruby-on-rails

turbolinks