0

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

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

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

此代码位于<head> </head>application.html.erb中

    <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 时不隐藏。

4

1 回答 1

0

设置该remote: true选项会告诉 Rails 使用UJS（不显眼的 javascript）来处理 ajax。这不是由 Turbolinks 处理的，因此您正在收听的 Turbolinks 事件不会被触发。您有两个选择：按原样使用 UJS，但听正确的事件： ajax:success或删除并让 Turbolinks 处理它（并像现在一样remote: true听）turbolinks:load

于 2021-05-24T20:02:48.483 回答