Исключение для элементов списка подменю при раскрытии меню

@Vzetgnf · Регистрация: 19.06.2017

Студворк — интернет-сервис помощи студентам

Здравствуйте. Пытаюсь сделать реализацию многоуровневого меню с jQuery. Возникла такая проблема, что при использовании $('.nav-menu li') раскрываются сразу все вложенные списки, в том числе подменю.
Как правильно прописать исключение для элементов списка подменю(nav-menu_into), чтобы скрипт на них не применялся?

JavaScript
1
$('.nav-menu li').not("#into").hover(function () {

и

JavaScript
1
$(".nav-menu li").not(document.getElementById("#into")).

не сработало.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div>
    <nav>
      <ul class="nav-menu">
        <li><a href="#">Заголовок 1</a>
          <ul>
            <li><a href="#">Меню 1</a></li>
          </ul>
        </li>       
        <li><a href="#">Заголовок 2</a>
          <ul id="nav-menu_into">
            <li><a href="#">Меню 2</a></li>             
            <li id="into"><a href="#">Меню 3</a>                
                <ul>
                    <li id="into"><a href="#">Подменю</a></li>
                </ul>                   
            </li>           
          </ul>
        </li>
    
      </ul>
    </nav>
  </div>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type="text/javascript">
$(document).ready(function(){
    $('.nav-menu li').not("#into").hover(function () {
        clearTimeout($.data(this,'timer'));
        $('ul',this).stop(true,true).slideDown(200);
    }, function () {
        $.data(this,'timer', setTimeout($.proxy(function() {
            $('ul',this).stop(true,true).slideUp(200);
        }, this), 100));
    });
 
$('#nav-menu_into li').hover(function () { 
clearTimeout($.data(this,'timer')); 
$('ul',this).stop(true,true).slideDown(200); 
}, function () { 
$.data(this,'timer', setTimeout($.proxy(function() { 
$('ul',this).stop(true,true).slideUp(200); 
}, this), 100)); 
});
});
</script>

@Уф · 23.06.2017, 10:44

https://jsfiddle.net/o4bhk9aa/

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div>
    <nav>
      <ul class="nav-menu">
        <li><a href="#">Заголовок 1</a>
          <ul>
            <li><a href="#">Меню 1</a></li>
          </ul>
        </li>       
        <li><a href="#">Заголовок 2</a>
          <ul id="nav-menu_into">
            <li><a href="#">Меню 2</a>
                <ul>
                    <li id="into"><a href="#">Подменю</a></li>
                </ul>
            </li>             
            <li id="into"><a href="#">Меню 3</a>                
                <ul>
                    <li id="into"><a href="#">Подменю</a></li>
                </ul>                   
            </li>           
          </ul>
        </li>
    
      </ul>
    </nav>
  </div>

JavaScript
1
2
3
4
5
6
7
8
9
$(document).ready(function(){
  $('ul.nav-menu').find('ul').hide();
  $('ul.nav-menu li').hover( 
    function() {
        $(this).children('ul').show();},
    function() {
        $(this).children('ul').hide();}
    );
});

Новые блоги и статьи Все статьи Все блоги /
Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .	Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .	SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .
SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .	Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .	SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .