элементы jQuery .next () - PullRequest
Новая
       3

элементы jQuery .next ()

0 голосов
/ 14 июля 2010

Это изменение в mootools сводит меня с ума.

HTML 

<tr class="teamicon">
    <td style="text-align: center;" width="100%" valign="middle">
    //Blahblah
    </td>
  </tr>
  <tr class="teamval">
    <td valign="middle" width="100%">
    //Blahblah
    </td>
  </tr>

Чего я хочу добиться.При нажатии на класс «teamicon» я хочу показать / скрыть tr с классом teamval с анимацией.Тем не менее, я не могу заставить его оживить должным образом.Похоже, внутри "teamval" должен быть анимирован в первую очередь (или я ошибаюсь?).

Моя попытка: 

jQuery(document).ready(function(){
$('.teamval').slideUp(400);
$('.teamicon').click(function(){
    if ($(this).next('tr').is(":hidden"))
    {   
        $(this).next('tr.teamval').$('td').slideDown(400, function(){
            $(this).next('tr.teamval').slideDown(400);
        });
    }
    else
    {
        $(this).next('tr.teamval').$('td').slideUp(400, function(){
            $(this).next('tr.teamval').slideUp(400);
        });
    }
});
});

OFC.Это неправильно ("$(this).next('tr.teamval').$('td')" возвращает ошибку в firebug).Как мне этого добиться?

Хотя я не могу поменяться на div.

1 Ответ

2 голосов
/ 14 июля 2010

Вы можете сделать одно из: 

$(this).next('tr.teamval').slideDown(...) // whole tr

$(this).next('tr.teamval').find('td').slideDown(...) // td descendant

Ошибка в том, что вы пытаетесь получить доступ к свойству $ в наборе элементов jQuery, который не существует.Вместо этого мы можем использовать find , который ищет подходящих потомков элементов в текущем наборе.

EDIT:

Хорошо, я думаю, вы хотите: 

if ($(this).next('tr').is(":hidden"))
{   
    var nextTeamval = $(this).next('tr.teamval');
    nextTeamval.find('td').slideDown(400, function(){
        nextTeamval.slideDown(400);
    });
}

Единственная потенциальная проблема - если teamval содержит td в td (вложенная таблица).Вы можете попробовать это jsFiddle demo.

...