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

JAMLIGHT,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  table {
 width:600px;
 border:1px;
 }
 [class*="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(){
var cls = $(this).data("cls")
$(cls).toggle();
})
})

  </script>
</head>

<body>
<table border="1">
  <tr class="spoil"  data-cls=".hide1">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide1">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide1">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="spoil" data-cls=".hide2">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide2">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide2">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="spoil" data-cls=".hide3">
    <td>можно</td>
    <td>развернуть</td>
  </tr>
  <tr class="hide3">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
  <tr class="hide3">
    <td>скрытые</td>
    <td>строки</td>
  </tr>
</table>



</body>
</html>
Ответить с цитированием