javascript - 页面刷新后执行jQuery函数

Question

我做了一个功能，检查窗口是否已调整大小以及元素是否可见，以便更改一些类并添加一点 css。问题是如果我刷新页面，更改将被还原。这是我的代码片段:

$(document).ready(function() {

 $(window).resize(function() {
   if(isMenuVisible() == true){
     $('#my-nav').removeClass('navbar-fixed-bottom');
     $('#my-nav').addClass('navbar-fixed-top');
     $('body').css('padding-top', '50px');
      } else{
      $('#my-nav').removeClass('navbar-fixed-top');
      $('#my-nav').addClass('navbar-fixed-bottom');
      $('body').css('padding-top', '0');  
   }
 }) ;
});

Answer 1

$(document).ready(function() {  
  
 function resizeChanges(){
    if(isMenuVisible() == true){
       $('#my-nav').removeClass('navbar-fixed-bottom');
       $('#my-nav').addClass('navbar-fixed-top');
       $('body').css('padding-top', '50px');
     }else{
       $('#my-nav').removeClass('navbar-fixed-top');
       $('#my-nav').addClass('navbar-fixed-bottom');
       $('body').css('padding-top', '0');  
     }   
 }
 
 $(window).resize(resizeChanges);
 
 resizeChanges();
});

通过这种方式，您可以定义一个单独的函数来进行更改，您可以添加事件监听器来触发它，还可以在加载/刷新后调用该函数本身。