1

Есть таблица с данными:

<table class="forums">
<tr class="forumtitle"><td><p class="forumstar"></p></td><td><a href="#"><h3>Обзор гаджетов 2011. Выпуск 5.</h3></a></td></tr>
<tr class="forumcontent"><td><p class="forumcomment"></p></td><td><span>Приветствую вас на пятом выпуске обзора гаджетов для ваших машинок. Сегодня в номере: 1. Очередная фигнюшка для подсветки клавиатуры 2. USB-пылесос, для чистки клавиатуры и рабочего стола. 3. Записная книжка. Все эти штуки работают от USB поэтому их называют гаджетами, удобными и приминимыми в любых условиях и любом месте.</span></td></tr>
<tr class="forumtitle"><td><p class="forumstar"></p></td><td><a href="#"><h3>Обзор гаджетов 2011. Выпуск 4.</h3></a></td></tr>
<tr class="forumcontent"><td><p class="forumcomment"></p></td><td><span>Приветствую вас на четвёртом выпуске обзора гаджетов для ваших машинок. Сегодня в номере: 1. Мини-колонки попрыгунчики. 2. Очередная подборка хабов. 3. Будильник и таймер. Все эти штуки работают от USB поэтому их называют гаджетами, удобными и приминимыми в любых условиях и любом месте.</span></td></tr>
<tr class="forumtitle"><td><p class="forumstar"></p></td><td><a href="#"><h3>Обзор гаджетов 2011. Выпуск 3.</h3></a></td></tr>
<tr class="forumcontent"><td><p class="forumcomment"></p></td><td><span>Приветствую вас на третьем выпуске обзора гаджетов для ваших машинок. Сегодня в номере: 1. Блокиратор USB и компьютера. 2. USB 3.0 интерфейс. 3. Зарядка для всех телефонов. Все эти штуки работают от USB поэтому их называют гаджетами, удобными и приминимыми в любых условиях и любом месте.</span></td></tr>
<tr class="forumtitle"><td><p class="forumstar"></p></td><td><a href="#"><h3>Обзор гаджетов 2011. Выпуск 2.</h3></a></td></tr>
<tr class="forumcontent"><td><p class="forumcomment"></p></td><td><span>Приветствую вас на втором выпуске обзора гаджетов для ваших машинок. Сегодня в номере: 1. Холодильник от USB. 2. USB-весы со специальном программой. 3. Тамагочи. Все эти штуки работают от USB поэтому их называют гаджетами, удобными и приминимыми в любых условиях и любом месте.</span></td></tr>
<tr class="forumtitle"><td><p class="forumstar"></p></td><td><a href="#"><h3>Обзор гаджетов 2011. Выпуск 1.</h3></a></td></tr>
<tr class="forumcontent"><td><p class="forumcomment"></p></td><td><span>Приветствую вас на первом выпуске обзора гаджетов для ваших машинок. Сегодня в номере: 1. Подогреваем чай не отходя от компьютерного стола. 2. USB-зажигалка. 3. Подушка с подогревом, на случай если решишь заснуть на компьютерном столе. Все эти штуки работают от USB поэтому их называют гаджетами, удобными и приминимыми в любых условиях и любом месте.</span></td></tr>
</table>

Нужно сделать чтобы forumcontent был сразу скрыт, а после нажатия (наведения) на forumtitle он раскрывался.

На данный момент листинг кода таков:

$(document).ready(function() {
    $(".forumcontent").slideUp();
    $(".forums").delegate(".forumtitle","click", function() {
        $(".forumtitle").next().slideDown();
    });
    //$(".forumtitle").hover(function() {
    //  $(".forumcontent").slideDown();
    //},function() {
    //  $(".forumcontent").slideUp();
    //});
});

Но я думаю вы сразу поняли, что этим способом открываются все блоки forumcontent, а нужно чтобы только тот, на соседа которого произошло событие. Искал подобные вещи в сети, ничего достойного не нашёл, по крайней мере хотелось бы разобраться с алгоритмом решения этой задачи.

2 ответа 2

2

Попробуйте так: (код написал на коленке, нужно протестить)

$(document).ready(function() {
    $(".forumcontent").slideUp();
    $(".forums .forumtitle").click(function() {
        var nx = $(this).next(".forumcontent");
        $(".forumcontent").not(nx).slideUp();
        $(nx).slideDown();
    });
});
1
  • Спасибо! То что надо!) Только почему-то плавный слайдинг не происходит. Даже если задать значение normal, slow, fast, ну да ладно, зато hide() и show с этими значениями эффектно работают.
    – chuikoff
    Commented 30 мар. 2011 в 4:44
0

используйте .filter()

$(document).ready(function() {
    $(".forumcontent").slideUp();
    $(".forums").delegate(".forumtitle","click", function() {
        $(".forumcontent").slideUp();
        $(this).next().filter(":first").slideDown();
    });
});
3
  • Это конечно не то что я хотел, но зато узнал про эту функцию. Пытался сделать filter(this) но чтот не работает.
    – chuikoff
    Commented 30 мар. 2011 в 4:44
  • слегка описался, в итоге с помощью фильтр можно упростить и сократить(я выше исправил) Прочитайте про filter (api.jquery.com/filter), крайне полезная штука что бы не городить всякие .not и тд
    – rnd_d
    Commented 30 мар. 2011 в 9:34
  • Решение неверно будет работать, т.к. $(".forumcontent").slideUp(); свернет все, а $(this).next().filter(":first").slideDown(); развернет нужный элемент и без fitler, т.е. необходимости в нем нет, но вот глючить будет, т.к. элемент уже сворачивается в данный момент. Commented 30 мар. 2011 в 12:45

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.