Это влияет на все элементы li .subnav, как я могу получить доступ только к дочернему элементу?

Question

Это влияет на все элементы li .subnav, как я могу получить доступ только к дочернему элементу?

$("#left_content").on('click', '.left_navigation ul li', function() { 
    $(".left_navigation ul li .sub_nav").slideToggle("slow"); 
}); 

Answer 1

$(".left_navigation ul li > .sub_nav").slideToggle("slow"); 

Answer 2

Если вам нужно sub_navs под ли, то сделать это: ".left_navigation ul li > .sub_nav"

Answer 3

Самым простым и быстрым будет ссылаться только подэлемент в вещи, которая была нажата. this будет относиться к пункту быть нажата, так мимоходом, что в качестве второго параметра $() будет только запрашивать элементы, вложенные в этот <li>

$("#left_content").on('click', '.left_navigation ul li', function() { 
    $('.sub_nav', this).slideToggle("slow"); 
}); 

Calling $(selector, this) такое же, как вызов $(this).find(selector) FWIW, если люди не знакомы с этим синтаксисом ,

Answer 4

Не видя разметку, трудно дать точный ответ, но это звучит, как вы просто нужно использовать this для переключения соответствующего .sub_nav:

$(this).find('.sub_nav').slideToggle('slow'); 

this представляет собой узел DOM, который инициировал click события, и .find('.sub_nav') ищет потомков этого узла с классом sub_nav

Answer 5

Попробуйте это:

$("#left_content").on('click', '.left_navigation ul li', function() { 
    $(this).children('.sub_nav').slideToggle("slow"); 
}); 

Метод .children() отличается от .find() тем, что .children() перемещается только на один уровень вниз по дереву DOM, а .find() может перемещаться по нескольким уровням, чтобы выбрать элементы-потомки (внуки и т. Д.).

Answer 6

$('.left_navigation ul li').click(function() { 
    $(this).find(".sub_nav").slideToggle("slow"); 
});