Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.04.2019, 22:42
Аспирант
Отправить личное сообщение для alex-romanov Посмотреть профиль Найти все сообщения от alex-romanov
 
Регистрация: 02.02.2019
Сообщений: 67

Как получить все ячейки текущего столбца
Я получаю контекст тег `th`, когда перебираю в цикле строку с названиями колонок и могу применить стили.

Но как получить все ячейки текущего столбца, чтобы назначить для них
единый стиль.

Через стиль тега `th` ячейки не изменяться
Ответить с цитированием
  #2 (permalink)  
Старый 16.04.2019, 23:02
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,502

alex-romanov,
:nth-child
Знаете ли вы селекторы?
Ответить с цитированием
  #3 (permalink)  
Старый 17.04.2019, 20:21
Аспирант
Отправить личное сообщение для alex-romanov Посмотреть профиль Найти все сообщения от alex-romanov
 
Регистрация: 02.02.2019
Сообщений: 67

ну а как здесь применить ?

/*применяем стили для колонок таблицы*/
        function applyStyleForThOfTable(selector) {

            if(!options.isUsedDataTables){

                var row = $(selector).find('thead > tr > th');

               var i = 0;
                $.each(row, function (index, value) {

                    var currentStyle = options.arrStyleForWidthTh[index];

                    var length = Object.keys(currentStyle).length;
                    
                    if(Object.keys(currentStyle).length === 0){
                        return true;
                    }

                   applyStyle(value , currentStyle);


                    ??????   value:nth-child(index + 1);

                });
            }

        }


value - это контекст текущей ячейке в строке заголовков колонок.

applyStyle(value , currentStyle);


так я могу применить стиль только к тегу `th`.
Ответить с цитированием
  #4 (permalink)  
Старый 17.04.2019, 20:26
Аспирант
Отправить личное сообщение для alex-romanov Посмотреть профиль Найти все сообщения от alex-romanov
 
Регистрация: 02.02.2019
Сообщений: 67

по логике , вот так
$('td:nth-child(' + index + ' 1)').css({...});


но это не работает.

nth-child - в своем цикле считает все элементы, находящиеся на одном уровне вложенности относительно родительского элемента.
То есть он должен будет пройти все ячейки текущего столбца.

Последний раз редактировалось alex-romanov, 17.04.2019 в 20:30.
Ответить с цитированием
  #5 (permalink)  
Старый 17.04.2019, 20:41
Аспирант
Отправить личное сообщение для alex-romanov Посмотреть профиль Найти все сообщения от alex-romanov
 
Регистрация: 02.02.2019
Сообщений: 67

вот как решил

/*применяем стили для колонок таблицы*/
        function applyStyleForThOfTable(selector) {

            if (!options.isUsedDataTables) {

                var row = $(selector).find('thead > tr > th');

                var i = 0;
                $.each(row, function (index, value) {

                    var currentStyle = options.arrStyleForWidthTh[index];

                    var length = Object.keys(currentStyle).length;

                    if (Object.keys(currentStyle).length === 0) {
                        return true;
                    }

                    applyStyle(value, currentStyle);

                    //  applyStyle ( 'td:nth-child(' + index + ' 1)', currentStyle);

                    var indexTd = index + 1;
                    $(value).css({
                        'width': '5%'
                    })

                    $('td:nth-child(' + indexTd + ' )').css({

                        'width': '5%',
                        'word-break': 'break-all', /*перенос слов*/
                        'wrap': 'soft'
                    });

                });
            }

        }
Ответить с цитированием
  #6 (permalink)  
Старый 17.04.2019, 20:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,502

alex-romanov,
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
$(function() {
 var index = 1;
 $('tbody tr td:nth-child(' + (index + 1) +')').css({"backgroundColor": "#FF0000"});
});
    </script>
</head>

<body>
<table width="400" summary="" >
	<thead>
		<tr>
			<th>Title 1</th>
			<th>Title 2</th>
			<th>Title 3</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Cell 1.1</td>
			<td>Cell 1.2</td>
			<td>Cell 1.3</td>
		</tr>
		<tr>
			<td>Cell 2.1</td>
			<td>Cell 2.2</td>
			<td>Cell 2.3</td>
		</tr>
	</tbody>
</table>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 17.04.2019, 21:13
Аспирант
Отправить личное сообщение для alex-romanov Посмотреть профиль Найти все сообщения от alex-romanov
 
Регистрация: 02.02.2019
Сообщений: 67

спасибо.
Еще заметил, чтобы изменить ширину определенного столбца :

Обязательно нужно одновременное применение стиля к заголовку столбца и к его ячейкам.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 11:29
Как получить значение ячейки таблицы внутри блока div, в итерации .each() Sanu0074 jQuery 1 21.01.2014 17:32
Как получить предыдущую ячейку при rowspan? Cepin Events/DOM/Window 35 16.07.2012 18:08
Как получить количество дней до определенной даты beard Общие вопросы Javascript 3 24.06.2012 16:22
Как получить все данные формы? FINoM Общие вопросы Javascript 9 14.02.2012 20:40