Alternar o próximo elemento (jQuery)
Pergunta
Html:
<div class="interview">
<h4>Interview</h4>
<a href="#" class="question">This is question 1?</a>
<div class="answer">This is an answer!</div>
<a href="#" class="question">This is question 2?</a>
<div class="answer">This is an answer!</div>
<a href="#" class="question">This is question 3?</a>
<div class="answer">This is an answer!</div>
</div>
jQuery:
if ($('interview')[0]) {
$('interview .question').toggle(function () {
$(this).next('.answer').slideIn();
},
function () {
$(this).next('.answer').slideOut();
});
}
... Não consigo descobrir por que não está funcionando.
Solução
Mantenha -se o ponto:
.interview
Além disso, não há deslize, tentar slideDown
e slideUp
: http://jsbin.com/ajawo3
Se você não tem nenhum outro código nessas funções, uma escolha melhor é slideToggle
: http://api.jquery.com/slideToggle/
Outras dicas
Você está usando um seletor de classe e deve começar com um .
Então você tem que mudar
$('interview .question')
para
$('div.interview .question')
Aqui está uma versão simples ...
$('a.question').click(function () {
$(this).next('.answer').slideToggle();
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow