Скрыть/Reveal доступных действий

Question

У меня есть список:

<ul class="action"> 
<li>Available actions</li> 
<li><a href="one.htm">One</a></li> 
<li><a href="two.htm">Two</a></li> 
</ul> 

И я хотел бы, чтобы скрыть список доступных действий до тех пор, пока пользователь не парит над ними:

jQuery(function($) { 
    $('ul.action a').hide(); 
    $('ul.action').hover(function() { 
     $(this).filter('a').show('slow'); 
    },function() { 
     $(this).filter('a').hide('slow'); 
    }); 
}); 

Я думаю, что я не понимаю что еще $ (это).

Answer 1

Вы хотите jQuery's .find() вместо the .filter() method.

В обработчике событий jQuery this ссылается на элемент, соответствующий селектору, который получил событие.

Таким образом, this относится к элементу <ul>. Таким образом, вам необходимо установить .find() вложенные элементы <a>.

jQuery(function($) { 
    $('ul.action a').hide(); 
    $('ul.action').hover(function() { 
     $(this).find('a').show('slow'); 
    },function() { 
     $(this).find('a').hide('slow'); 
    }); 
}); 

При использовании .filter(), вы проверяете соответствующий комплект (в данном случае <ul>), чтобы увидеть, если он находит какие-либо матчи против фильтра вы даете ему (в данном случае "a").

Потому что <a> никогда не было <ul>, не было бы совпадений с .filter().

---

В качестве примечания, вы можете упростить код так:

Пример:http://jsfiddle.net/tNTAa/

jQuery(function($) { 
    $('ul.action a').hide(); 
    $('ul.action').hover(function(e) { 
     $(this).find('a').toggle('slow', e.type === 'mouseover'); 
    }); 
}); 

Answer 2

Попробуйте

$(this).find('a').show('slow'); 

вместо

$(this).filter('a').show('slow'); 

(и то же самое для hide)

Вы хотите найти все дочерние a элементы текущего ul.

http://api.jquery.com/filter/
http://api.jquery.com/find/