在jquery函数设置之前重新加载页面

Question

我的jquery文件有问题，应该切换导航栏。但它只有在我重新加载页面时才有效。我怎样才能实现它不仅在页面刷新时每次都会切换？

这是我的jquery文件

$(document).ready(() => {

 $('.projekte').on('click', () => {
 $('.nav-projekte').toggle();
 $('.nav-portfolio').hide();
 });

 $('.portfolio').on('click', () => {
 $('.nav-portfolio').toggle();
 $('.nav-projekte').hide();
 });
}); 

Answer 1

将隐藏从'nav-projekte'和'nav-portfolio'更改为切换，当您使用切换时，该操作与show和hide触发器不同。第一个切换可能会显示，下一个切换将隐藏。

Answer 2

toggle()方法在hide（）和show（）之间切换所选元素。

因此，如果元素被隐藏，它将显示它，如果元素被显示，它将隐藏它。

我想你想做那样的事情：

 $(document).ready(() => {

   $('.projekte').on('click', () => {
     // $('.nav-projekte').show();
     // $('.nav-portfolio').hide();
     $('.nav-projekte').toggle();
     $('.nav-portfolio').toggle();
   });

   $('.portfolio').on('click', () => {
     // $('.nav-portfolio').show();
     // $('.nav-projekte').hide();
     $('.nav-portfolio').toggle();
     $('.nav-projekte').toggle();
   });
}); 

（在评论中是没有toggle()的方式，只需显示并隐藏按下每个元素时所需的内容。）

但如果你的意思是动作没有绑定到元素，只有在刷新页面时，它可能是因为TurboLinks。

您可以尝试添加page:load事件，而不是仅使用document.ready()函数，如示例中所示：

$(document).on('ready page:load', function(event) {
  // Your code goes here
});

或者，您可以通过执行以下操作从rails应用程序中删除turbo链接：

1. 从宝石文件中删除gem 'turbolinks'。
2. 从//= require turbolinks文件中删除application.js
3. 在文件application.html.erb中你需要从文件中的两行删除'data-turbolinks-track': 'reload'（或者如果你使用rails 4然后删除"data-turbolinks-track" => true）。