VPF::jQuery гармошки таблицы - Форум программистов

_Spirit_

Дата 25.2.2009, 19:27 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 37
Регистрация: 29.1.2008
Где: Киев

Репутация: нет
Всего: нет

Всем привет помогите пожалуйста, есть таблица при выборе ссылки (class="btn") должен скрываться/отображаться тот div с class="panel" который находится под данной ссылкой, а у меня скрываются/отображаться все. Как привязать конкретный блок к конкретной ссылке?

Код


<head>
  <script type="text/javascript" src="jquery-1.3.1.min.js"></script>

  <script type="text/javascript">
    $(document).ready(function() {
      $(".btn").click(function() {
        $(".panel").slideToggle("slow");
        $(this).toggleClass("active");
      });
    });
  </script>
</head>
<body>
<table width="50">
  <tr>
    <td><a href="#" class="btn">click1</a></td>
  </tr>
  <tr>
      <td><div class="panel">реагируем на click1</div></td>
  </tr>

  <tr>
    <td><a href="#" class="btn">click2</a></td>
  </tr>
   <tr>
      <td><div class="panel">реагируем на click2</div></td>
  </tr>

</table>

</body>

_Spirit_

Дата 26.2.2009, 11:59 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 37
Регистрация: 29.1.2008
Где: Киев

Репутация: нет
Всего: нет

решение нашла

Код


<head>
  <script type="text/javascript" src="jquery-1.3.1.min.js"></script>

  <script type="text/javascript">
    $(document).ready(function() {
      $(".btn").click(function() {
        $("." + this.id).slideToggle("slow");
        $(this).toggleClass("active");
      });
    });
  </script>
</head>
<body>
<table width="50">
  <tr>
    <td><a href="#" class="btn" id="rrr">click</a></td>
  </tr>
  <tr>                                                                                         
      <td><div class="rrr">hghghghghg</div></td>
  </tr>
  <tr>
    <td><a href="#" class="btn" id="fff">click</a></td>
  </tr>
   <tr>
      <td><div class="fff">hghghghghg</div></td>
  </tr>

</table>

</body>

ksnk

Дата 26.2.2009, 12:33 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

Вот еще одно решение...

Код


<head>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript">
    $(function() {
      $(".btn").click(function() {
        $(this).parents('tr').eq(0).next().find('div').slideToggle("slow");
        $(this).toggleClass("active");
        return false; // !!! обязательно поставить !!!
      });
    });
  </script>
</head>
<body>
<table width="50">
  <tr>
    <td><a href="#" class="btn">click</a></td>
  </tr>
  <tr>                                                                                         
      <td><div>hghghghghg</div></td>
  </tr>
  <tr>
    <td><a href="#" class="btn">click</a></td>
  </tr>
   <tr>
      <td><div>hghghghghg</div></td>
  </tr>
</table>
</body>

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

krundetz

Дата 28.2.2009, 03:05 (ссылка)

(нет голосов)

Загрузка ...

Вечный странник

Профиль
Группа: Завсегдатай
Сообщений: 1400
Регистрация: 14.6.2007
Где: НН(Сормово)

Репутация: 1
Всего: 69

В свое время решение подобной задачи нашел в ведение, четкого указания на родителя в виде дополнительного аттребута вида

Цитата

parentId='id'

где id идентификатор родительского элемента, алгоритм сводился к тому что при клике на родительский элемент, пробегались строки таблицы и если родителем данной строки был этот элемент ей назначался класс который скрывал ее. Удалось также создать память. Тоесть если у данного потомка были свои потомки, а у них свои и какие то из них были открыты(показаны) другие закрыты(скрыты), после скрытия первого родителского элемента скрывались и все потомки, а при открытии открывались в том же виде в каком были перед закрытием. Как точно я это делал не помню, но точно хватило всего лишь работы с дом структурой.

Это сообщение отредактировал(а) krundetz - 28.2.2009, 03:08

--------------------

!цензоры - Хранитель стратегической жидкости
Группа ТГВ
Группа Нижний Новгород

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »