Ruby on Rails DOM 更新仅在页面重新加载后有效答案

【问题标题】：Ruby on Rails DOM updates only work after page reloadRuby on Rails DOM 更新仅在页面重新加载后有效
【发布时间】：2017-04-09 01:32:17
【问题描述】：

我正在根据当前路由更新 html 元素的类名。当单击元素时，我还有一些 jquery 来显示菜单。当我在主页上时，html 类被正确添加到 html 元素中，并且在单击时菜单正确显示。但是，当我通过单击导航链接导航到另一条路线时，路线会正确更改，但 html 类名没有更新，并且 jquery 不再触发。

application_helper.rb

  def html_class(class_name)
    content_for(:html_class) { class_name }
  end

application.html.erb

<html class="<%= yield(:html_class) || '' %>"> <!-- class is only updated on page reload -->

home.html.erb

<% html_class 'nail' %>

projects/index.html.erb

<!-- no html_class provided, should default to '' -->
<div class="row projects">
  <% @projects.each do |project| %>
    <%= render project %>
  <% end %>
</div>

site.js

//当路由改变时页面必须重新加载才能触发

$(function() {
  $('#initials').click(function() {
    $('.slider, .nav-btn').toggleClass('closed');
  })
});

【问题讨论】：

你在使用 turbolinks 吗？
是的，我是 Rails 新手，所以感谢您的帮助。

标签： jquery css ruby-on-rails

【解决方案1】：

尝试用下面的包装你的 jQuery。该问题可能是由 Turbolinks 引起的，它加载了您使用 AJAX 单击的页面以加快速度。所以这个包装器告诉 Javascript 在 turbolinks 加载时触发，而不是在整个页面刷新时触发。

$(document).on('turbolinks:load', function() {
  $('#initials').click(function() {
    $('.slider, .nav-btn').toggleClass('closed');
  })
});

【讨论】：

不错！这适用于 jQuery，是否对 css 有类似的操作？
没有。只需使用 Javascript。