Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.08.2017, 15:24
Профессор
Отправить личное сообщение для atanov Посмотреть профиль Найти все сообщения от atanov
 
Регистрация: 27.06.2016
Сообщений: 180

скрыть столбец таблицы
Доброго времени, форумчане.

Задача скрыть столбец таблицы. Таблица приличная >600 строк, 11 столбцов.
Можно ли реализовать условие скрытия ячейки по её номеру в строке? Например № 11 или № 7.
Другими словами - в строке <tr></tr> есть 11 <td></td>, можно ли скрыть определённую <td></td>, слева № 5?
Ответить с цитированием
  #2 (permalink)  
Старый 30.08.2017, 15:26
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

Сообщение от atanov
скрыть столбец таблицы
Сообщение от atanov
можно ли скрыть определённую <td></td>
Нипанятна...
Ответить с цитированием
  #3 (permalink)  
Старый 30.08.2017, 15:28
Профессор
Отправить личное сообщение для atanov Посмотреть профиль Найти все сообщения от atanov
 
Регистрация: 27.06.2016
Сообщений: 180

Сообщение от ksa
ksa
Перебирать все строки и скрывать ячейку в стоке № 7. Можно по номеру в строке или придётся id или другую метку присваивать?
Ответить с цитированием
  #4 (permalink)  
Старый 30.08.2017, 15:31
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

atanov,
$('table tr').eq(/*-1 + номер строки*/).find('td').eq(/*-1 + номер столбца*/).hide();
Ответить с цитированием
  #5 (permalink)  
Старый 30.08.2017, 15:31
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
</table>
<input type="text" id="input" value="5"/>
<script>
  $(function(){
    $('#input').on('input change blur click',function(){
      $('td:nth-child('+this.value+')').toggle() //.hide()
    });
  });
</script>
Ответить с цитированием
  #6 (permalink)  
Старый 30.08.2017, 15:32
Профессор
Отправить личное сообщение для atanov Посмотреть профиль Найти все сообщения от atanov
 
Регистрация: 27.06.2016
Сообщений: 180

Сообщение от Nexus
Nexus
Спасибо, вот только хотелось бы на чистом javascript.
Ответить с цитированием
  #7 (permalink)  
Старый 30.08.2017, 15:34
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

Сообщение от atanov
на чистом javascript
Дык!

<table border='1'>
<tr>
	<td>0 0</td><td>0 1</td><td>0 2</td>
</tr>
<tr>
	<td>1 0</td><td>1 1</td><td>1 2</td>
</tr>
<tr>
	<td>2 0</td><td>2 1</td><td>2 2</td>
</tr>
</table>
<script type='text/javascript'>
var col=1;
var o=document.querySelector('table');
for (var i=0; i<o.rows.length; i++) {
	o.rows[i].cells[col].style.display='none';
};
</script>
Ответить с цитированием
  #8 (permalink)  
Старый 30.08.2017, 15:35
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

atanov, вроде так:
document.querySelectorAll('table tr')[/*-1 + номер строки*/].querySelectorAll('td')[/*-1 + номер столбца*/].style.display='none';

Последний раз редактировалось Nexus, 30.08.2017 в 15:48.
Ответить с цитированием
  #9 (permalink)  
Старый 30.08.2017, 15:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Сообщение от atanov
на чистом javascript.
<meta charset="utf-8">
<style type="text/css">
.hide{
  display: none;
}

</style>
<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>10</td>
        <td>11</td>
    </tr>
</table>

<script>
  [].forEach.call( document.querySelectorAll('td:nth-child(5)'), function(el) {
         el.classList.add('hide');
  });

</script>
Ответить с цитированием
  #10 (permalink)  
Старый 30.08.2017, 15:36
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

Сообщение от atanov
скрыть столбец таблицы
Сообщение от atanov
Перебирать все строки и скрывать ячейку в стоке № 7
Опять нипанятна...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не сортировать один столбец таблицы Leon2110 Javascript под браузер 11 06.07.2016 11:57
Скрыть столбец в таблице со вложенными заголовками Arukueido Элементы интерфейса 3 11.07.2015 11:29
помогите скрыть столбец td Class _Eldar_ Общие вопросы Javascript 4 12.03.2015 12:52
Определить столбец в событии itemdblclick таблицы mrEugens ExtJS 0 27.12.2011 21:16
Скрыть таблицы в зависимости от урла vovach Общие вопросы Javascript 26 25.10.2008 18:43