JQuery для выбора тега привязки, пройдя через тег UL

Я хочу выбрать тег привязки в div, но я хочу выбрать из дочернего тега ul, поскольку пытаюсь создать раскрывающийся список.

Мой HTML-код выглядит следующим образом:

<div>
  <a href='#'>Dropper 1</a>
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
  </ul>
  <a href='#'>Dropper 2</a>
  <ul>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
  </ul>
</div>

Мой код JQuery выглядит следующим образом:

$(document).ready(function(){
  $('ul').each(function(){
    $(this).parent().click(function(){ $('ul',this).show("1000"); });
    $(this).parent().mouseleave(function(){ $('ul',this).hide("1000"); });
  });
})

CSS для кода UL выглядит следующим образом:

ul {display:none;}

Теперь UL скрыт, и я хочу выбрать якорь, используя UL. Вышеупомянутая функция работает прямо сейчас, потому что она выбирает DIV в качестве родителя, и при нажатии на div отображается ul, но поскольку размер div такой же, как размер тега привязки, поэтому, если кто-либо нажимает на div, это то же самое, что и щелчок по его дочерний элемент, который является якорем, и когда происходит щелчок по якорю, поведение браузера по умолчанию — прокрутка вверх из-за href='#'. Я хочу выбрать этот якорь, чтобы остановить прокрутку, используя event.preventDefault();

Просто скажите мне, как выбрать этот тег привязки, пройдя через UL


jquery siblings
person Hamid    schedule 23.09.2011    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я думаю, это то, что вы хотели:

$('ul').each(function() {
    $(this).prev('a').click(function(e) {
        e.preventDefault();
        $(this).next().show("1000");
    });
    $(this).mouseout(function() {
        $(this).hide("1000");
    });
});

http://jsfiddle.net/ghLCv/2/

person Blazemonger    schedule 23.09.2011
comment
@Heder: Ваш комментарий не очень полезен. Может быть, вы можете объяснить, что именно не работает, какие ошибки возникают и т. д. - person Felix Kling; 23.09.2011
comment
mbase75 спасибо за ответ. Я попробовал ваш код, и он работает так же, как я хочу. Просто изменил mouseout на mouseleave, ну а в остальном все работает нормально.. - person Hamid; 23.09.2011