Я пытаюсь открыть выпадающее меню, используя onmouseover и onmouseout.функция ошибки onmouseover и onmouseout не определена
<div id="adminDropdown" class="dropdown" dropdown>
<a onmouseover="openDropdownMenu('adminDropdown')"
onmouseout="closeDropdownMenu('adminDropdown')">
Admin
</a>
<ul class="dropdown-menu" role="menu">
<li><a>Submenu 1</a></li>
<li><a>Submenu 2</a></li>
</ul>
</div>
<div id="userProfile" class="dropdown" dropdown>
<a onmouseover="openDropdownMenu('userProfile')"
onmouseout="closeDropdownMenu('userProfile')">
Username
</a>
<ul class="dropdown-menu" role="menu">
<li><a>Submenu 1</a></li>
<li><a>Submenu 2</a></li>
</ul>
</div>
Мой Javascript имеет следующий код:
$rootScope.openDropdownMenu = (id: string) => {
var dropdown = document.getElementById(id);
dropdown.classList.add('open');
};
$rootScope.closeDropdownMenu = (id: string) => {
var dropdown = document.getElementById(id);
dropdown.classList.remove('open');
};
Но каждый раз, когда я мыши над ссылками это дало бы мне Uncaught ReferenceError: openDropdownMenu is not defined
и то же самое с функцией closeDropdownMenu.
Я попытался:
$rootScope.dropdown = document.getElementById('adminDropdown');
$rootScope.dropdown.addEventListener("mouseover",() => {
$rootScope.dropdown.classList.add('open');
});
$rootScope.dropdown.addEventListener("mouseout",() => {
$rootScope.dropdown.classList.remove('open');
});
Но я хочу, чтобы иметь возможность изменить идентификатор параметра, так что я могу использовать ту же функцию более одного раза, как у меня есть более чем один выпадающий список.
Может кто-нибудь просветить меня по этой ошибке? Благодарю.
Вместо этого вы можете использовать jQuery ... – xdevs23
Что такое '$ rootScope'? –