在 rails 中重新加载页面后某些功能无法使用

Question

我有一个导航栏和侧边栏。在导航栏中，我有一个搜索框、侧边栏最小化按钮、个人资料下拉框和注销。

在侧边栏我有家、关于、订单和联系我们。

我的 rot 页面是主页。加载根页面后，某些图像未显示。单击侧栏中的主页 link 后显示。下拉列表也会发生同样的事情，并且在重新加载页面后也不起作用。我也在使用 jquery 插件。

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

请帮我解决我需要添加什么代码来解决我的问题。我是 rails 的新手，谢谢。
更新

<div class="table-responsive">
                            <table class="table table-actions-bar m-b-0">
                                <thead>
                                    <tr>
                                        <th></th>
                                        <th>product Name</th>
                                        <th>product status</th>
                                        <th style="min-width: 80px;">Manage</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <% i =0 %>
                                    <% @products.each do |products| %>
                                    <% if i == 0 %>
                                    <tr>
                                        <td><span data-plugin="peity-bar" data-colors="#5fbeaa,#5fbeaa" data-width="80" data-height="30">5,3,9,6,5,9,7,3,5,2</span></td>
                                        <td><img src="assets/products/iphone.jpg" class="thumb-sm pull-left m-r-10" alt=""> <%= product['productname'] %> </td>
                                        <% if product['status'] != "buy" %>
                                        <td><span class="text-custom"><%= product['status'] %></span></td>
                                        <% else %>
                                        <td><span class="text-danger"><%= produt['status'] %></span></td>
                                        <% end %>
                                        <td>
                                          <a href="#" class="table-action-btn"><i class="md md-edit"></i></a>
                                          <a href="#" class="table-action-btn"><i class="md md-close"></i></a>
                                      </td>
                                  </tr>

这是根据数据绘制的图表..

Answer 1

这很可能发生，因为您没有将 js 脚本包装在 $(document).ready 调用中。您可以将 turbolinks 添加回 application.js 文件，然后将所有 js 脚本包装在 page:load 调用中，如下所示：

var ready;
ready = function() {

  ...your javascript goes here...

};

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

当由于 turbolinks 仅获取您的应用程序的一部分时，page:load 将触发。

如果你有 RAILS 5 你可以：

$(document).on('turbolinks:load', function() {

  ...your javascript goes here...

});

Answer 2

您是否尝试过先使用 jquery.turbolinks gem？

jQuery-turbolinks

它专为 Turbolinks 3 或更低版本量身定制，但如果您已经跳转到 5，则可以下载 Turbolinks 5 填充程序并将其放入您的系统中。

Turbolinks compatibility shim

在 rails 中重新加载页面后某些功能无法使用

Some functions are not working after reloading page in rails

javascript

jquery

ruby-on-rails

reload