为什么预加载器有时不会消失？

(Please note: I have one similar question active - but it's completely different as to the problem)

(请注意:我有一个类似的问题是活跃的 - 但问题完全不同)

Please see here for an example

请看这里的例子

As you click through the left navigation menu, notice that every other click the preloader doesn't disappear... I don't know why.

当您单击左侧导航菜单时,请注意每次点击预加载器都不会消失...我不知道为什么。

Here's the code I have:

这是我的代码:

I left some comments to make it easier to understand. Thanks a lot everyobody :)

我留下了一些评论,以便更容易理解。非常感谢每个人:)

var pageToLoad = '';
switch( this.id ){
        case 'events_map_button':
      $('#huge-loader').fadeIn('fast', function() {  //show preloader
      pageToLoad = 'partytool.html';                 //define page to load
      });
      break;
        case 'event_search_tool_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'partytool.html';
          configureEvents();
      });
      break;
        case 'party_photos_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'partyphotos.html';
      });
      break;
        case 'taxi_finder_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'taxiservices.html';
      });
      break;
        case 'weather_forecast_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'weatherforecast.html';
      });
      break;
        case 'contact_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'contact.html';
      });
      break;
}
if( '' !== pageToLoad ){                                //if the variable isn't empty
   $('#right-content').load( pageToLoad, function() {   //load the page
   $("#huge-loader").fadeOut("slow");                   //then hide preloader
   });
}

1 个解决方案

#1

You are hitting the bottom portion of the code before the pageToLoad is set. Put that bottom portion in each of your fadeout complete functions.

在设置pageToLoad之前,您正在访问代码的底部。将底部放在每个淡出完成功能中。