在 Rails 中，jQuery 对象在页面加载后消失，刷新时重新出现

Question

我有一些自定义 jQuery 代码可以创建业务优化机器的前端。

simutronX.js

$(function(){
    $("#slider_constraint_a").slider({
    orientation: "vertical",
    range: true,
    values: [17, 67],
    slide: function(event, ui) {
      $("#constraint_a").val(ui.values[0] + " - " + ui.values[1]);
      }
    });
    $("#constraint_a").val($("#slider_constraint_a").slider("values", 0) +
      " - " + $("#slider_constraint_a").slider("values", 1));

    ...

    $("#slider_constraint_e").slider({
    orientation: "vertical",
    range: true,
    values: [17, 67],
    slide: function(event, ui) {
      $("#constraint_e").val( ui.values[0] + " - " + ui.values[1] );
      }
    });
    $("#constraint_e").val( $("#slider_constraint_e").slider("values", 0) +
      " - " + $("#slider_constraint_e").slider("values", 1));
});

页面加载时，约束滑块出现的时间非常短，然后消失。刷新时，这些项目会重新出现。我已经 gem 按照建议 here 安装了 jquery-turbolinks gem 并将其添加到我的 application.js 文件中，然后预编译了资产并重新启动了服务器。

application.js

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require jquery-ui

这似乎没有帮助。 jquery-turbolinks readme 中列出了类似的问题（例如双重加载...），但我的代码似乎没有列出任何问题。

还有什么建议吗？

Answer 1

我以前遇到过这个问题。解决方案是在 Jquery 代码周围加上 on change 操作，而不是在你的 js 文件

中使用 on load 操作

 $(document).on('page:change', function(){

在 Rails 中，jQuery 对象在页面加载后消失，刷新时重新出现

In Rails, jQuery objects disappear after pageload, reappear on refresh

javascript

jquery

ruby-on-rails

ruby-on-rails-5

turbolinks