@Odiseu
Учусь верстать сайты, как хобби, после работы.

Как отключить временно все ссылки в меню сайта, jQuery?

Добрый день. На сайте при переходе на новую страницу на открытой странице проигрывается анимация (допустим 3 секунды) топом открывается новая страница. В то время, когда проигрывается закрывающейся страницы мне нужно отключить все пункты меню, что бы они не реагировали на клик пока анимация не закончится.
Пробовал в index убрать класс tabs удалив его в руками все работает, но если я удаляю его скриптом, то ссылки продолжают работать, хоть в панели разработчика класс исчезает.

var links = ['#tab1'];

$('.tabs li a').on('click', function(){
	var id = $(this).attr('href');
	var pages = $(this).parents('.tab-wrap').find('.tab-cont');
	  if(links.indexOf(id)==-1){
			links.unshift(id);
  } 
  var lastId = links[1];
  $(lastId).addClass('anim2');
  
  function pausePage (){
		links.splice([1],1);
		$(pages).addClass('hide').removeClass('anim').removeClass('anim2');
  	$(id).removeClass('hide').addClass('anim');
  }
  setTimeout (pausePage,3000);
		
 	$(this).parent().siblings().removeClass('active');
 	$(this).parent().addClass('active');
	return false;
});
  • Вопрос задан
  • 48 просмотров
Решения вопроса 1
во первых, вам следовало бы посмотреть что делает метод preventDefault();
далее, не просто вставить его в свой код, а соответственно его изменить.
что вам нужно? на время выполнения каких-то действий заблокировать меню, следовательно в это время обработчик меню не должен выполнять код по onclick
что для этого сделать?
например при загрузке страницы выставлять флаг , назовем его blockLinks = true
в обработчике onclick проверять установлен ли данный флаг и если установлен то просто выходить ничего не выполняя
через 3 секунды после загрузки сбросить флаг в false
все.

и почему вы функцию pausePage и setTimeout запихали внутрь обработчика по onclick меню??

должно быть как-то так:

во время загрузки устанавливается флаг blockLinks
после загрузки страницы (см. $( document ).ready() )
вешается обработчик на click и запускается setTimeout

var links = ['#tab1'];
var blockLinks = true; // флаг блокировки меню

// функция выполняющаяся по истечении таймаута
function pausePage (){
  // сбрасываем флаг блокировки меню
  blockLinks = false;
  // далее остальной код .........
  links.splice([1],1);
  $(pages).addClass('hide').removeClass('anim').removeClass('anim2');
  $(id).removeClass('hide').addClass('anim');
}

$(function(){
// ниже код который выполняется после загрузки страницы
  // устанавливаем обработчик на click
  $('.tabs li a').on('click', function(e){
    // проверяем флаг blockLinks
    if (blockLinks) {
      // если установлена блокировка выходим!
      e.preventDefault();
      return false;
    }
    // здесь ниже код который должен выполняться по клику
    // ................
    // ................
  });
  
  // запускаем таймер
  setTimeout (pausePage,3000);
})
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
profesor08
@profesor08
const links = Array.from(document.querySelectorAll(".menu .link"));

for (const link of links) {
  link.addEventListener("click", e => e.preventDefault());
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы