2013-07-02 3 views
0

Я пытаюсь настроить некоторые JavaScript для на моем сайте здесь:JavaScript развернуть/свернуть не работает?

(http://jsfiddle.net/davidThomas/Wkat3/)

Я проверял это, но я не могу заставить его работать. Вот что я вложил, но он, похоже, не хочет свернуть и развернуть, как в результате.

<html> 
<title> 
</title> 
<head> 
<script src="js/jquery-2.0.2.min.js"></script> 
<script> 
$('li:not(".q")').hide(); 

$('li.q').click(
function(){ 
    $('li:not(".q")').slideUp(); 
    $(this).nextUntil('.q').slideDown(); 
}); 

</script> 
</head> 
<body> 
<ul> 
    <li class="q">Question One</li> 
    <li>first answer to question one</li> 
    <li>second answer to question one</li> 
    <li class="q">Question two</li> 
    <li>first answer to question two</li> 
    <li>second answer to question two</li> 
    <li class="q">Question three</li> 
    <li>first answer to question three</li> 
    <li>second answer to question three</li> 
</ul> 
</body> 
</html> 

Помогите! Друг помог мне установить jQuery, поэтому я не уверен, что это проблема или нет.

Заранее спасибо.

+0

любая ошибка в вашем браузере консоли –

ответ

0

Попробуйте оборачивать ваши JS с JQuery (документ) .ready

jQuery(document).ready(function() { 
$('li:not(".q")').hide(); 

$('li.q').click(
function(){ 
    $('li:not(".q")').slideUp(); 
    $(this).nextUntil('.q').slideDown(); 
}); 
}); 
+0

Спасибо для быстрого ответа! просто скопировал его с сайта, так как никогда не использовал JavaScript раньше :) –

0

Попробуйте использовать .slideToggle() для текущего элемента

$('li:not(".q")').hide(); 

$('li.q').click(function(){ 
    var $li = $(this).nextUntil('.q'); 
    $('li:not(".q"):visible').not($li).slideUp(); 
    $li.slideToggle(); 
}); 

Демо: Fiddle

Смежные вопросы