Показать сообщение отдельно
  #1 (permalink)  
Старый 04.10.2021, 15:27
Аспирант
Отправить личное сообщение для win32s Посмотреть профиль Найти все сообщения от win32s
 
Регистрация: 28.09.2019
Сообщений: 38

Событие и вложенный список
Пишу код обработки вложенного списка, почему-то клик срабатывает не только на категории, а и на элементы (хотя не должно вроде).

Т.е. если нажать на категорию РНР, то она сворачивается (книжки по РНР), но - если нажать на элемент списка (php book..), то категория тоже сворачивается. Неясно почему, т.к. клик назначен на li.subcat, а там просто LI..
<!doctype html><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Book index</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
console.log("jquery working");

$("li.subcat").on("click",function(event) 
		{
		$(this).children("ul").toggle();

		event.stopPropagation();
		});
		
$("a.item0").click( function () { event.stopPropagation();})
});
</script>
</head><body>
<ol>
<li class="subcat"><a href="#">Web</a>
	<ul>
		<li class="subcat"><a href="#">PHP</a>
			<ul class="book">
				<li>php book1</li>
				<li>php book2</li>
			</ul>
		</li>		
		
		<li class="subcat"><a href="#">JS</a>
			<ul class="book">
				<li>adada</li>
				<li>2121</li>
	
				<li><a class="item0"  target="_blank" href="#">jQuery учебник для начинающих - Антон Шевчук</a></li>
				<li>22</li>
			</ul>
		</li>
		
		<li class="subcat"><a href="#">CSS</a>
			<ul class="book">
				<li>adada</li>
				<li>2121</li>
			</ul>
		</li>		
		
		<li class="subcat"><a href="#">HTML</a>
			<ul>
				<li>adada</li>
				<li>2121</li>
			</ul>
		</li>
	</ul>
</li>
<li class="subcat"><a href="#">Windows</a>
	<ul>
		<li class="subcat"><a href="#">Главное</a>
			<ul class="book">
				<li>adada</li>
				<li>2121</li>
			</ul>
		</li>		
		
		<li class="subcat"><a href="#">Потоки</a>
			<ul class="book">
				<li>adada</li>
				<li>2121</li>
			</ul>
		</li>
		
		<li class="subcat"><a href="#">Службы</a>
			<ul class="book">
				<li>adada</li>
				<li>2121</li>
			</ul>
		</li>		
		
		<li class="subcat"><a href="#">Графика</a>
			<ul class="book">
				<li><a class="item0" href="file:///20API.pdf" target="_blank">Проектирование интерфейса пользователя средствами Win32 api</a> - Р.М.Ганеев</li>
				<li><a class="item0" href="file:///D:iya_3643348.pdf" target="_blank">Технология программирования C++ Winapi</a> - Литвиненко</li>
			</ul>
		</li>
	</ul>
</li>
</ol>



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