Предотвратить двойное выполнение функции jquery?

#jquery

#jquery

Вопрос:

Я настроил функцию this для отображения одного div за раз, который был выбран в навигации.

 $(document).ready(function(){
    $('.div1, .div2').hide();
    $("nav a").hover(function () {  
    var name= this.name;
    $("." name).fadeIn().siblings().hide();
   });  
});
  

Эта функция работает, но если я очень быстро переключаюсь между своим элементом навигации, может случиться так, что div1 и div2 появятся одновременно.

Как я могу предотвратить это?

Спасибо.

Ответ №1:

Добавьте вызов stop, чтобы остановить существующую анимацию перед скрытием.

 $(document).ready(function(){
    $('.div1, .div2').hide();
    $("nav a").hover(function () {  
    var name= this.name;
    $("." name).fadeIn().siblings().stop(true, true).hide();
   });  
});
  

Комментарии:

1. Отлично! Такое элегантное и простое решение. Очень полезно знать для будущих сценариев. Большое вам спасибо!

2. О, я только что понял, что анимация останавливается в какой-то момент, если я переключаюсь на fast, а div может остановиться на половине непрозрачности и не восстанавливается. Как это происходит? Может ли переписывание скрипта быть надежным решением?

3. Вы пробовали передавать true в качестве второго параметра stop , согласно документации?

4. Теперь это работает как шарм! Большое вам спасибо за второй запуск! 🙂