Особенности выборки элементов массива в jQuery
$('.underLine:eq(0)').on('click', function(e){
$('.itemsWrap:eq(0)').addClass("zoomIn open").removeClass("zoomOut closE"); }); $('.underLine:eq(1)').on('click', function(e){ $('.itemsWrap:eq(1)').addClass("zoomIn open").removeClass("zoomOut closE"); }); $('.underLine:eq(2)').on('click', function(e){ $('.itemsWrap:eq(2)').addClass("zoomIn open").removeClass("zoomOut closE"); }); $('.underLine:eq(3)').on('click', function(e){ $('.itemsWrap:eq(3)').addClass("zoomIn open").removeClass("zoomOut closE"); }); Как заставить обработчик событий отслеживать элемент на котором случилось событие без перечисления их индексов,т.е чтоб он сам определил его и применил событие только к нему не затрагивая другие элементы этого массива??? |
сфздщсл,
Выложите лучше HTML кликабельных и обрабатываемых элементов Ибо много текста у Вас |
<div class="underLine"></div>
<div class="itemsWrap animated"> .................................................. ....... </div> <div class="underLine"></div> <div class="itemsWrap animated"> .................................................. ....... </div> <div class="underLine"></div> <div class="itemsWrap animated"> .................................................. ....... </div> Кликабельный очень большой.Принцип такой-при клике на underLine раскрывается itemsWrap.Я просто не могу понять как заставить сработать событие на конкретном underLine. |
$('.underLine').on('click', function(){ //Не пому нафиг надо переключать четыре класса ? $(this).next().toggleClass('zoomIn open').toggleClass('zoomOut closE').toggle(); }); Типично переключается единственный класс Доcтаточно для любых css манипуляций, посколь есть псевдо-класс not:active $('.underLine').on('click', function(){ $(this).next().toggleClass('active').toggle(); }); |
Задача не в том,чтоб переключить 4 класса.Нужно заставить переключение срабатывать не на всех элементах класса underLine,а на том на который в конкретный момент кликнули и применить функцию к только к его дочернему элементу itemsWrap не задевая остальные.
|
сфздщсл,
Вы оттестили выданный код ? (вместо Вашего длинного ) Дайте ссылку на демку |
$('.underLine').on('click', function(){
$(this).next().addClass('zoomIn open'); }); В таком виде работает.Я так понимаю .next() выбирает следующий элемент в DOM?А как быть в случае если он не следующий? |
Цитата:
Цитата:
Посмотрите справочник: http://jquery.page2page.ru/index.php...траница - Слево: карта функций для начала: Cелекторы и Работа с набором Вообще для jQuery есть свой раздел тут на форуме: http://javascript.ru/forum/jquery/ |
Благодарю Вас.Вы мне очень помогли.
|
Местные специалисты называют этот прием - делегирование.
Надо просто по event.target получать элемент который щелкнули внутри элемента который прослушивается. |
Часовой пояс GMT +3, время: 11:26. |