Выпадающий список Bootstrap 5, кликабельный родительский URL ⇐ Jquery

[Гость]

Я пытаюсь создать Navabar Bootstrap 5 с раскрывающимся списком, который будет отображаться при наведении курсора, и родительским элементом, который будет доступен для кликов на экранах размером более 992 пикселей.

У меня шоу при наведении работает нормально со следующим JavaScript.

document.addEventListener("DOMContentLoaded", function(){ если (window.innerWidth > 992) { document.querySelectorAll('.navbar .nav-item').forEach(function(everyitem){ Everyitem.addEventListener('mouseover', function(e){ let el_link = this.querySelector('a[data-bs-toggle]'); если (el_link! = ноль) { пусть nextEl = el_link.nextElementSibling; el_link.classList.add('показать'); nextEl.classList.add('показать'); } }); Everyitem.addEventListener('mouseleave', function(e){ let el_link = this.querySelector('a[data-bs-toggle]'); если (el_link! = ноль) { пусть nextEl = el_link.nextElementSibling; el_link.classList.remove('показать'); nextEl.classList.remove('показать'); } }) }); } }); И это прекрасно работает. У меня возникли проблемы с тем, чтобы заставить родителя перейти по URL-адресу.

Использование

$('.navbar .nav-item > a').click(function() { location.href = this.href; } }); Не работает, и мне не удалось найти подходящее решение в Интернете.

Я пробовал

document.querySelectorAll('.dropdown-menu').forEach(function(element){ element.addEventListener('click', function (e) { location.href = this.href; }); }) Это тоже не работает.

Что я делаю не так?

Изменить. Извините, вот HTML

• Родитель Саб 1
• Саб 2
• Саб 3