Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как остановить пузырьковое всплытие? (https://javascript.ru/forum/jquery/45932-kak-ostanovit-puzyrkovoe-vsplytie.html)

Duda.Ml1986@gmail.com 21.03.2014 12:57

Как остановить пузырьковое всплытие?
 
усть меню вида

<ul id='nav'>
  <li><a>link</a>
       <ul class='sub'>
            <li><a>link</a>
                 <ul class='subsub'>
                    <li><a>link</a></li>
                    <li></li>
                    <li></li>
                    <li></li>
                 </ul>
            </li>
            <li><a>link</a></li>
       </ul>  
  </li>
  <li><a>link</a></li>
  <ul>



Когда я хочу повесить обработчик только на главную часть с id nav то он передается и на нижнее меню . Как это остановить?
Потом еще отключаются ссылки последнего меню а они мне нужны для переходов.

Хочу сделать что бы по клику на #nav li откр. его дочерний элемент .sub если он есть. А при клике на .sub li откр. его дочерний элемент .subsub если он есть


Пока получается такое г. Консоль пишет:
nav
nav
nav

КОроче голова опухла. Прошу пинка в нужном направлении и спасибо за уделенное время.

$('#nav > li').click(function(e) {
        e.preventDefault();

        //console.log(e.target);
        console.log('nav');
        $('#nav > li').find("ul:first").toggle();
        e.stopPropagation();
    });

    $('.sub > li').click(function(e) {
        e.preventDefault();
        e.stopPropagation();
        //console.log(e.target);
        console.log('sub');
        $('.sub > li').find("ul:first").toggle();
        e.stopPropagation();
    });

ksa 21.03.2014 13:14

Цитата:

Сообщение от Duda.Ml1986@gmail.com
Как это остановить?

http://javascript.ru/tutorial/events...ovka-vsplytiya

рони 21.03.2014 13:17

Duda.Ml1986@gmail.com,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <style type="text/css">
   li  > ul {
    display: none;
  }
  </style>
</head>

<body>
<ul id='nav'>
  <li><a>link</a>
       <ul class='sub'>
            <li><a>link</a>
                 <ul class='subsub'>
                    <li><a>link</a></li>
                    <li></li>
                    <li></li>
                    <li></li>
                 </ul>
            </li>
            <li><a>link</a></li>
       </ul>
  </li>
  <li><a>link</a></li>
  </ul>
  <script>
      $('ul > li').click(function(e) {
        e.preventDefault();
        e.stopPropagation();
        $('ul:first',this).slideToggle();
    });



  </script>

</body>

</html>

danik.js 21.03.2014 14:02

Цитата:

Сообщение от Duda.Ml1986@gmail.com
e.preventDefault();

А какое действие по умолчанию (default) ты предотвращаешь (prevent)? Разве по клику по <li> браузер что-то делает?

Duda.Ml1986@gmail.com 21.03.2014 15:48

Спасибо за ответы но товарищ ИДИОТ, тобесть я, сделал ошибку в коде, это жопа, все сразу заработало)
Еще раз спасибо!!!!

Duda.Ml1986@gmail.com 21.03.2014 15:49

Крутой чувак, куда деваться !


Часовой пояс GMT +3, время: 18:07.