Почему Swiper меню открывается со второго нажатия?

Question

[zahar_92]

Всем привет!

Суть вопроса.. Используется Swiper Slider для мобильного меню на сайте otlg.ru. Проблема в том, что если пункт меню имеет подпункты, то раскроются они только при втором нажатии на родительский пункт. В консоли видно, что изначально в дереве меню присутствует только ul class="level1", а level2 появляется в коде после первого нажатия на родительский элемент (но не перелистывается к пользователю) . И после второго нажатия перелистывается к пользователю.
Пример можно посмотреть otlg.ru меню - Каталог (с мобильного телефона или через консоль)

Вопрос, как убрать лишний клик?

Comments

[alvvi]

В хроме вообще не открывается ни каталог, ни меню в мобильной версии

[zahar_92]

Илья Ростопка: Странно.. У меня в хроме все открывается.

Answer 1

[zahar_92]

Вот этот блок кода, судя по всему, отвечает за вывод level2 в меню. Подскажите, как его поменять, чтобы level2 уже был подгружен при открытии меню или чтобы при нажатии на level1 он не только подгружался, но и отображался пользователю

Посмотреть код

// Left menu
	if(Modernizr.touch){
		var leftcatalog = new Swiper('.menublock', {
			prevButton: '.menublock .backlink a',
			spaceBetween: 0,
			slidesPerView: 1,
			// disable touch slide
				simulateTouch: false,
				shortSwipes: false,
				longSwipes: false,
				followFinger: false,
		});

		// LEVEL1 BRANCH

		$(document).on('click','.leftside .level1 .branch',function(e){
			// GET LEVEL2 CAPTION
			var caption = $(this).text();


			leftcatalog.slideTo(1);


			//...
			// AJAX QUERY ?
			mobileMenu = $('.menublock .level1');
			id = $(this).data('id');
			lvl = $(this).data('lvl');
			if (!id) {console.log('error'); return false}
			$(this).parents('.level'+lvl).nextAll().remove();
			$.ajax({
				url: 'index.php?route=api/menu',
				type: 'get',
				data: 'id=' + id,
				dataType: 'json',
				beforeSend: function() {
					mobileMenu.parent().append('<ul class="level'+(++lvl)+' swiper-slide"><li class="backlink"><a href="#" data-gotostep="'+(--lvl)+'">Назад</a></li><li class="title"><a></a></li></ul>');
				},
				success: function(json) {
					// Need to set timeout otherwise it wont update the total
					setTimeout(function () {
						column = mobileMenu.parent().children().last();
						txt = '';
						$.each(json, function(index, value){
							txt += '<li><a href="'+value['link']+'" data-id='+value['id']+' data-lvl="'+(++lvl)+'">'+value['name']+'</a></li>'
						});
						column.html(column.html() + txt);
					}, 100);
					$('.level'+(++lvl)+' .title').text(caption);
					setTimeout(function () {
						leftcatalog.update();
						leftcatalog.attachEvents();
					}, 100);
					leftcatalog.slideNext();
				},
				error: function(xhr, ajaxOptions, thrownError) {
						alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
				}
			});
			//...

			e.preventDefault();
		});