在 Rails 5 中使用 sortable.js 和 turbolinks答案

【问题标题】：Using sortable.js and turbolinks in Rails 5在 Rails 5 中使用 sortable.js 和 turbolinks
【发布时间】：2017-12-14 16:37:43
【问题描述】：

我有一个 Rails 5.1 应用程序，我在其中使用来自 https://www.kryogenix.org/code/browser/sorttable/ 的 sortable.js 库来对表进行一些简单的客户端排序。

我遇到了一个问题，当页面首次加载时，表格排序不起作用。（它根本没有响应。）如果您随后手动重新加载页面（cmd-R 或等效项），那么它确实有效。

经过一番搜索，我认为问题是由 turbolinks 引起的。像这样的帖子，还有人建议如何修改JS代码来解决它：Rails javascript only works after reload

要引用该页面上的答案，您必须通过这样做告诉 turbolinks 加载：

document.addEventListener("turbolinks:load", function() {
  my_func();
})

然而，我不是 JS 专家，因此有点讨厌在 sortable.js 代码中胡闹太多。我正在寻求有关解决问题的侵入性最小的方法的帮助。

【问题讨论】：

不太清楚你帖子中的问题是什么？
要明确：问题是：有没有一种简单的方法可以修改 sortable.js 库，以便它与 turbolinks 一起使用。谢谢！

标签： javascript ruby-on-rails turbolinks

【解决方案1】：

为了未来的 Google 员工，发布一个可行的解决方案。

我必须做两件事才能让它工作：

1：注释掉 init 函数顶部的行，以防止它运行多次。所以我在 sorttable.js 中的 init 函数的顶部看起来像这样：

    sorttable = {
      init: function() {
        // Had to comment these top to out to get things to work with turbolinks
        // quit if this function has already been called
        //if (arguments.callee.done) return;
        // flag this function so we don't do the same thing twice
        //arguments.callee.done = true

将此代码添加到文件中的其他位置。（我个人在“window.onload = sorttable.init;”行之后添加了它
```
document.addEventListener("turbolinks:load", function() {
  sorttable.init();
})
```

【讨论】：