@smsi

Нет перехода по ссылкам из-за JS функции. Как изменить JS функцию, чтобы переход по ссылкам заработал?

День добрый.
Изучаю Django.
Возникла трудность с использованием готового шаблона, который я переделываю.

Есть код меню, который ведет себя следующим образом:
Меню по клику открывается, пункты меню по клику разворачиваются, но при клике по ссылкам внутри переход по ссылкам не происходит, меню просто сворачивается.
Мне понятно, что это из-за навешанной функции JS, но, к сожалению, JS я совсем не знаю.
Как изменить поведение функции таким образом, чтобы при клике по ссылкам осуществлялся переход по ним?

Выделил ключевой кусок кода:
Код html
<div class="page_menu_content">
    <ul class="page_menu_nav">
        <li class="page_menu_item">
        <li class="page_menu_item has-children">
            <a href="#">Меню<i class="fa fa-angle-down"></i></a>
            <ul class="page_menu_selection">
                 <li id = "id2"><a href="/2/">2</a></li>
                 <li id = "id1"><a href="/1/">2</a></li>
            </ul>
        </li>
    </ul>
</div>


Код JS
function initPageMenu()
	{
		if($('.page_menu').length && $('.page_menu_content').length)
		{
			var menu = $('.page_menu');
			var menuContent = $('.page_menu_content');
			var menuTrigger = $('.menu_trigger');

			//Open / close page menu
			menuTrigger.on('click', function()
			{
				if(!menuActive)
				{
					openMenu();
				}
				else
				{
					closeMenu();
				}
			});

			//Handle page menu
			if($('.page_menu_item').length)
			{
				var items = $('.page_menu_item');
				items.each(function()
				{
					var item = $(this);
					if(item.hasClass("has-children"))
					{
						item.on('click', function(evt)
						{
							evt.preventDefault();
							evt.stopPropagation();
							var subItem = item.find('> ul');
						    if(subItem.hasClass('active'))
						    {
						    	subItem.toggleClass('active');
								TweenMax.to(subItem, 0.3, {height:0});
						    }
						    else
						    {
						    	subItem.toggleClass('active');
						    	TweenMax.set(subItem, {height:"auto"});
								TweenMax.from(subItem, 0.3, {height:0});
						    }
						});
					}
				});
			}
		}
	}

	function openMenu()
	{
		var menu = $('.page_menu');
		var menuContent = $('.page_menu_content');
		TweenMax.set(menuContent, {height:"auto"});
		TweenMax.from(menuContent, 0.3, {height:0});
		menuActive = true;
	}

	function closeMenu()
	{
		var menu = $('.page_menu');
		var menuContent = $('.page_menu_content');
		TweenMax.to(menuContent, 0.3, {height:0});
		menuActive = false;
	}

Код css не привожу, он не важен, мне кажется.
Интуитивно мне кажется, что из нужно вытащить id и подставить соответствующий ему a href в location, но как это сделать - не пойму.
Помогите пожалуйста. Заранее спасибо.
  • Вопрос задан
  • 76 просмотров
Пригласить эксперта
Ответы на вопрос 1
@xonar
У вас evt.preventDefault(); это отменяет дефолтное поведение. Как по мне правильнее было бы сделать, чтоб при нажатие на выпадающее меню ему навешивался класс active у которого в стилях было бы показывать этот блок, а по дефолту эти менюшки выпадающие скрыть. Тут больше стилями можно сделать, чем JS
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
22 окт. 2019, в 22:14
10000 руб./за проект
22 окт. 2019, в 21:26
10000 руб./за проект
22 окт. 2019, в 20:50
4000 руб./за проект