Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   СКРЫТИЕ ЭЛЕМЕНТОВ ТАБЛИЦЫ (https://javascript.ru/forum/events/31484-skrytie-ehlementov-tablicy.html)

bes 11.09.2012 17:17

Цитата:

Сообщение от cyber
как я вижу автор не понимает толком что ему надо, а вы если знаете то не нужно предлагать таких без смысленных решений .

так-то автор чётко выразил свою мысль
Цитата:

Сообщение от Brook
как мне скрыть часть таблицы допустим со второй строки по последнюю или еще как нибудь

хотя бы до
Цитата:

Сообщение от Brook
или еще как нибудь..

и зачастую ТС начинает выражать свои мысли яснее, когда видит, что его не понимают

cyber 11.09.2012 17:27

Цитата:

Сообщение от bes (Сообщение 204153)
так-то автор чётко выразил свою мысль

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

Сергей Fortoo 07.03.2024 23:50

Немного изменил вариант от bes
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<style>
.row {
  width: 100%;
  display: flex;
}
.product-layout {
  width: 40%;
}
td {
  border: solid 1px;
}
tr.tr_hide {
  display: none;
}
tr.tr_hide.active {
  display: table-row;
}
</style>

<div class="row">
<div class="product-layout">
<table>
    <tbody>
	<tr><td>11</td><td>12</td><td>13</td></tr>
	<tr><td>21</td><td>22</td><td>23</td></tr>
	<tr><td>31</td><td>32</td><td>33</td></tr>
	<tr><td>41</td><td>42</td><td>43</td></tr>
	<tr><td>51</td><td>52</td><td>53</td></tr>
    </tbody>
</table>
<!-- Кнопки скрыть/показать -->
<button class="hide">hide</button>
<button class="show">show</button>
</div>

<div class="product-layout">
<table>
    <tbody>
	<tr><td>11</td><td>12</td><td>13</td></tr>
	<tr><td>21</td><td>22</td><td>23</td></tr>
	<tr><td>31</td><td>32</td><td>33</td></tr>
	<tr><td>41</td><td>42</td><td>43</td></tr>
	<tr><td>51</td><td>52</td><td>53</td></tr>
    </tbody>
</table>
<!-- Кнопки скрыть/показать -->
<button class="hide">hide</button>
<button class="show">show</button>
</div>
</div>

<script>
$(document).ready(function() {
        function sh(first, last) {
            $('table tbody').each(function(index, element) {
            	var elems = $(element);
            	var rows = elems[0].rows;
            	var len = rows.length;
            	
            	if (len <= last){
            	    return
            	}

            	for (var i = 0; i < len; i++) {
            		rows[i].classList.remove('tr_hide');
            	}
        		
            	for (var i = last; i < len; i++) {
            		rows[i].classList.add('tr_hide');
            	}
            })
        }
    
    	$(document).on("click", ".hide", function () {
    	    var index = $(this).index('.hide');
    	    var currentLayout = $($('.product-layout')[index]);
    	    var currentButton = currentLayout.find('.tr_hide').removeClass('active');
    	})
    	$(document).on("click", ".show", function () {
    	    var index = $(this).index('.show');
    	    var currentLayout = $($('.product-layout')[index]);
    	    var currentButton = currentLayout.find('.tr_hide').addClass('active');
    	})
    	
    	
        var first = Number(1);
        var last = Number(3);
        sh(first, last);
})
</script>

рони 08.03.2024 11:03

Цитата:

Сообщение от Сергей Fortoo
ПЫТАЮСЬ СДЕЛАТЬ КНОПКУ Посмотреть! и не получается

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
и загрузку jQuery добавьте.

Сергей Fortoo 09.03.2024 15:21

рони,Спасибо за подсказку!
А здесь есть возможность подписаться на тему?

рони 10.03.2024 11:08

Цитата:

Сообщение от Сергей Fortoo
А здесь есть возможность подписаться на тему?


мой кабинет - опции -
Методы подписки на темы
Когда Вы создаете новую тему или отвечаете в теме, Вы можете выбрать автоматическое добавление этой темы


так же тут вверху есть - опции темы


Часовой пояс GMT +3, время: 00:18.