Тема: addEventListener
Показать сообщение отдельно
  #10 (permalink)  
Старый 14.09.2016, 16:11
Профессор
Отправить личное сообщение для Manyasha Посмотреть профиль Найти все сообщения от Manyasha
 
Регистрация: 21.09.2015
Сообщений: 196

DivMan,
у Вас обработка события срабатывает и на внутренних списках, нужно проверять, точно ли мы нажали на элемент списка с классом item:
<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <style>
	.none{display: none}
	.block{display: block}
	</style>
<script>
window.onload=function(){
	var item = document.querySelectorAll('.item');
	for(var i = 0; i < item.length; i++){
		item[i].addEventListener('click', function(e){
			if (e.target.classList == "item"){
				var target = e.target.parentNode.childNodes
				for(var m = 0; m <target.length; m++){
					if(target[m].nodeType == 1){
						target[m].children[0].classList.remove('block');
					}
					
				}
				if(e.target.children[0].classList.contains('none')){
					e.target.children[0].classList.toggle('block');
				}
			}
		});
	}
}
</script>
  </head>

  <body>
   		<div class="main-menu">
			<ul class="ul">
				<li class="item">Игры
					<ul class='none'>
						<li>Гонки</li>
						<li>Стрелялки</li>
					</ul>
				</li>
				<li class="item">Софт
					<ul class='none'>
						<li>windows</li>
						<li>Антивирусы</li>
					</ul>
				</li>
				<li class="item">Софт
					<ul class='none'>
						<li>windows</li>
						<li>Антивирусы</li>
					</ul>
				</li>
				<li class="item">Софт
					<ul class='none'>
						<li>windows</li>
						<li>Антивирусы</li>
					</ul>
				</li>
				<li class="item">Софт
					<ul class='none'>
						<li>windows</li>
						<li>Антивирусы</li>
					</ul>
				</li>
			</ul>
		</div>
		
		<script src="script.js"></script>
  </body>

</html>
Ответить с цитированием