使用 Turbolinks 时，使用 Javascript 更改元素类失败

如何解决使用 Turbolinks 时，使用 Javascript 更改元素类失败

我有以下代码试图在 body 元素上切换一个类：

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

    // Minimalize menu
    $(document).on('click','.navbar-minimalize',function (event) {
         $('body').toggleClass('mini-navbar');
    })

    ...

它每次都适用于新页面加载，但此后的所有其他链接导航都失败了。新页面加载（类切换有效）、第 1 次链接点击（损坏）、第 2 次链接点击（有效）等

请注意，当我发现该错误时，我最初使用的是 jQuery，然后转移到 vanilla JS 以查看它是否是 jQuery 问题。不用说，它不是。

我一个一个地删除了一堆其他依赖项，唯一能解决这个问题的是删除 Turbolinks 并用 jQuery 的 turbolinks:load 替换 document.ready 事件。

使用 Chrome Dev 工具进行分析时，显示类列表正在尝试被操纵（暂时以黄色突出显示），但最终没有任何变化。

我知道这很奇怪，可能是我的代码库独有的。我就是想不通该死的错误。

-- 更新 1 --

这是相关的 HTML 标记。注意“navbar-minimalize”的“a”标签类是触发器。 body 标签是 js 试图切换类的元素。

<!-- topnavbar.html.erb -->
<div class="row border-bottom" id="vue-autocomplete-app">

    <nav class="white-bg navbar navbar-static-top" role="navigation" style="margin-bottom: 0">

        <div class="navbar-header">

            <a class="navbar-minimalize minimalize-styl-2 btn btn-primary" href="#"><i class="fa fa-bars"></i> </a>



            <form role="search" class="form form-inline navbar-form-custom" method="" action="">

                <global-search></global-search>

            </form>

        </div>

    </nav>

</div>

然后是加载上述模板的rails模板代码：

<!-- application.html.erb -->
<body class="fixed-sidebar">

    <!-- Wrapper-->
    <div id="wrapper">
        <!-- Navigation -->
        <%= render 'layouts/navigation' %>

        <!-- Page wraper -->
        <div id="page-wrapper" class="gray-bg">

            <!-- Page wrapper -->
            <%= render 'layouts/topnavbar' %>
...

-- 更新 2 --

如果我将切换代码移到 turbolinks:load 之外的文档中，一切似乎都正常。话虽如此，这似乎是 turbolinks 的某种古怪行为。

有什么帮助吗？这里有什么问题？