Форум

Goodizer · #1 (**permalink**) 19.09.2013, 02:18

Добрые люди, подскажите!

<ul>
   <li>Menu 1
      <ul style="display:none">
         <li>Menu 1.1</li>
         <li>Menu 1.2</li>
         <li>Menu 1.3</li>
      </ul>
   </li>
   <li>Menu 1</li>
   <li>Menu 1</li>
</ul>

$('ul li').bind('click',function() {
   $('ul li ul').show();
});

Все очень просто, только мое меню имеет ТРИ уровня и писать код к каждому li, ul выйдет очень громоздким.

У меня есть идея, но я не знаю как ее воплотить!

Мне надо чтото типо этого:

$('ul li').bind('click',function() {
   var elements = $(this) + ' ul'; - это синтаксически неправильно!
   $(elements).show();
});

Может есть иной способ.
Буду очень рад помощи!

рони · #2 (**permalink**) 19.09.2013, 02:40

Goodizer,

$('ul li').on('click',function() {
   var elements = $('ul:first', $(this));
   elements.show();
})

Deff · #3 (**permalink**) 19.09.2013, 03:00

Goodizer, http://habrahabr.ru/post/169265/#first_unread

ruslan_mart · #4 (**permalink**) 19.09.2013, 04:45

$('ul li').click(function() {
   $(this).find('ul').show();
});

ksa · #5 (**permalink**) 19.09.2013, 09:50

Сообщение от Ruslan_xDD

$('ul li').click(function() {
   $(this).find('ul').show();
});

Так он все дочерние ul откроет...

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
	$('li').click(function (event){
		$(this).children('ul').toggle();
		event = event || window.event;
		if (event.stopPropagation) {
			event.stopPropagation();
		} else {
			event.cancelBubble = true;
		}
	});
});
</script>
</head>
<body>
<ul>
	<li>Menu 1
		<ul style="display: none;">
			<li>Menu 1.1
				<ul style="display: none;">
					<li>Menu 1.1.1</li>
					<li>Menu 1.1.2</li>
					<li>Menu 1.1.3</li>
				</ul>
			</li>
			<li>Menu 1.2</li>
			<li>Menu 1.3</li>
		</ul>
	</li>
	<li>Menu 1</li>
	<li>Menu 1</li>
</ul>
</body>
</html>

Goodizer · #6 (**permalink**) 19.09.2013, 15:55

Спасибо огромное всем!

Форум

Справочник

Discord чат

Курсы javascript