Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery условие "разворачивания" сторок в таблице / 1 сообщений из 1, страница 1 из 1
19.06.2014, 19:59
    #38674755
Spl@sH
Spl@sH
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
jQuery условие "разворачивания" сторок в таблице
Ув.эксперты!
Подскажите, пожалуйста, как реализовать такую логику выполнения 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
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery условие "разворачивания" сторок в таблице / 1 сообщений из 1, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 426ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1446982]:
 0ms
get settings:
 8ms
get forum list:
 15ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 156ms
get topic data:
 9ms
get forum data:
 3ms
get page messages:
 24ms
get tp. blocked users:
 1ms
others: 204ms
total:  426ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]