Показать сообщение отдельно
  #13 (permalink)  
Старый 07.02.2017, 22:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

JAMLIGHT,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  table {
 width:600px;
 border:1px;
 }
 .hide {
 display:none;
 }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function(){
$('.spoil').click(function(){
$(this).nextUntil('.spoil').toggle();
})
})

  </script>
</head>

<body>
<table border="1">
  <tr class="spoil">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="spoil">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="spoil">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
</table>


</body>
</html>

Последний раз редактировалось рони, 07.02.2017 в 22:45.
Ответить с цитированием