jQuery условие "разворачивания" сторок в таблице / HTML, JavaScript, VBScript, CSS

ReSQL.ru

Мобильная версия Контакт Правила FAQ Помощь

Гость

Войти | Регистрация | Профиль | Очистить

Новые сообщения | Избранное

Форумы | Пользователи | Статистика | Мод. лог | Поиск

Цитировать

Написать

Автор*:

Ввести пароль для входа

Тема*:

Сообщение

Данное сообщение тематическое

Сообщение содержит картинки или видео 18+

Автор:

ВНИМАНИЕ! На данном подфоруме действуют строгие правила. Удостоверьтесь, что ваше сообщение соответствует им!

Форум или тема закрыты для гостей. Необходима авторизация!

Загрузить последнюю сохраненную версию

Вложение:

Вставить как галерею

Максимальный размер вложений: 4,0 МБ, аудио/видео: 8,0 МБ. Картинки большего размера ужимаются, если возможно.

Введите код, изображенный на картинке. Если код нечитаемый, кликните картинку, чтобы загрузить другой вариант.

Отправляя сообщение, я выражаю свое согласие с правилами форума и принимаю пользовательское соглашение.

Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр

Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery условие "разворачивания" сторок в таблице

1 сообщений из 1, страница 1 из 1

jQuery условие "разворачивания" сторок в таблице

#38674755

Spl@sH

Гость

Ув.эксперты!
Подскажите, пожалуйста, как реализовать такую логику выполнения jQuery
Табличная часть формируется циклом. По задумке, при наведении курсора мыши должны "раскрываться" лишь стоки со статусом OFF.
Я полагаю, что скрипт должен как-то учитывать то, что в столбце Status будет ON/OFF и в зависимости от этого добавлять class="odd" или не добавлять. Как это можно сделать?

Код: html

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <style type="text/css">
    #wrap {width: 25%;}
    #invoicing_tbl {
      border: 1px solid #dddddd;
      border-collapse: separate;
      border-spacing: 0;
      text-align: center;
      width: 100%;
    }
    #invoicing_tbl thead  {
      background: #dcdddf;
    }
    #invoicing_tbl th { 
      padding: 10px 10px;
      text-align: center;
    }
    #invoicing_tbl td {
      color:#000;
      padding:7px 15px;
      border-top: 1px solid #dddddd;
    }
    #invoicing_tbl tr.odd td {
      cursor:pointer;
    }
    #invoicing_tbl tr.odd:hover {
        background-color: #dcdddf;
    }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript">// <![CDATA[
    $(document).ready(function(){
      $("#invoicing_tbl tr:odd").addClass("odd");
      $("#invoicing_tbl tr:not(.odd)").hide();
      $("#invoicing_tbl tr:first-child").show();
      
      $("#invoicing_tbl tr.odd").click(function(){
          $(this).next("tr").toggle();
      });
    });
  // ]]></script>
</head>
<body>
  <div id="wrap">
    <form method="post" action="/cgi-bin/yourprogram.pl" enctype="application/x-www-form-urlencoded">
        <table id="invoicing_tbl">
          <thead>
            <tr>
              <th>№</th>
              <th>Name</th>
              <th>Status</th>
            </tr> 
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>First</td>
              <td>OFF</td>
            </tr>
            <tr>
              <td colspan="3">
                <input type="submit" class="submit_btn" value="ON">
                <input type="submit" class="submit_btn" value="OFF">
              </td>
            </tr>
            <tr>
              <td>2</td>
              <td>Second</td>
              <td>ON</td>
            </tr>
            <tr>
              <td colspan="3">
                <input type="submit" class="submit_btn" value="ON">
                <input type="submit" class="submit_btn" value="OFF">
              </td>
            </tr>
            <tr>
              <td>3</td>
              <td>Third</td>
              <td>OFF</td>
            </tr>
            <tr>
              <td colspan="3">
                <input type="submit" class="submit_btn" value="ON">
                <input type="submit" class="submit_btn" value="OFF">
              </td>
            </tr>            
          </tbody>        
        </table>
      </form>
    </div>
</body>
</html>

...

Рейтинг:

0 / 0

19.06.2014, 19:59

| Ответить | Цитировать | Написать

1 сообщений из 1, страница 1 из 1

Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery условие "разворачивания" сторок в таблице

Читали тему (0):

Читали форум (0):

Пользователи онлайн (0):

start [/forum/topic.php?fid=22&fpage=97&tid=1446982]:	0ms
get settings:	10ms
get forum list:	11ms
check forum access:	4ms
check topic access:	4ms
track hit:	31ms
get topic data:	10ms
get forum data:	2ms
get page messages:	25ms
get tp. blocked users:	1ms
others:	249ms

total:	347ms

	Необходимые cookie
	Cookie для сбора статистики
	Cookie для маркетинга и рекламы