ajaxStart/turbolinks:click 在使用远程点击链接时不会触发：true答案

【问题标题】：ajaxStart/turbolinks:click are not fired when clicking on link using remote: trueajaxStart/turbolinks:click 在使用远程点击链接时不会触发：true
【发布时间】：2021-08-13 02:34:45
【问题描述】：

尝试在单击带有远程 true 的链接时显示微调器，尝试了两种方式使用 turbolinks:events 和 ajaxStart/ajaxStop 事件。 turboinks:load 事件已成功触发，但 :click 没有。 ajaxStart 和 ajaxStop 都不起作用。

使用 rails 6、turbolinks 5、webpacker。链接正在以非常正常的方式生成示例：

<%=link_to 'Documents', documents_path, remote: true %>

这段代码放在application.html.erb的<head> </head>

    <script type="text/javascript">
    
    
    $(document).on("turbolinks:load", function(){
     alert('turbolinks load works');
     //$(".sk-cube-grid").hide();
    });
    
    
    
    
      $(document).on("turbolinks:click", function(){
       alert('this doesnt work');
      //$(".sk-cube-grid").show();
    });
   
    </script>

使用 ajaxStart/ajaxStop 的代码也可以放在 application.html.erb 中

$(document).ajaxStart(function(){
  alert('started ajax - doesnt work');
});

$(document).ajaxStop(function(){
  alert('stopped ajax - doesnt work');
})

编辑

将事件处理更改为以下内容：

var page_loaded = function() {
  $(".sk-cube-grid").hide();
};


$(document).on("read page:load", page_loaded);

$(document).on("ajax:send", "a", function(xhr){
      $('.sk-cube-grid ').show()
}).on("ajax:complete", "a", function(data, status, xhr) {
  $(".sk-cube-grid").hide();
});

此代码在 ajax:starts 时显示（）.sk-cube-grid，但在 :complete 或 :success 时不隐藏。

【问题讨论】：

标签： javascript jquery ruby-on-rails ajax turbolinks-5

【解决方案1】：

设置remote: true 选项告诉Rails 使用 UJS (unobtrusive javascript) 来处理ajax。这不是由 Turbolinks 处理的，因此您正在收听的 Turbolinks 事件不会被触发。你有两个选择：像你一样使用 UJS but listen to the correct event: ajax:success 或删除 remote: true 并让 Turbolinks 处理它（并像现在一样听 turbolinks:load）

【讨论】：

坚持远程：真，注意到并非所有带有远程：真的link_to都会触发ajax：成功，只有“新”操作的方法。
也许您的某些操作失败了？他们都应该触发 ajax:success。无论如何，这能回答你的问题吗？
不，不幸的是，当单击远程：true 链接时，ajax:success 和 ajax:complete 不会被触发。我试图删除远程：是的，即使启用了 turbolinks，单击也会完全加载页面，而不是渲染处理模式的 .js.erb 文件（在我的情况下）。
我使用稍微不同的代码编辑了这个问题。如果您看一下，我们将不胜感激。