Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.12.2018, 18:58
Аспирант
Отправить личное сообщение для SolomonRei Посмотреть профиль Найти все сообщения от SolomonRei
 
Регистрация: 05.04.2018
Сообщений: 77

перенос на следующую строку
Добрый вечер.Есть скрипт,который добавляет товары на экран,добавляет он их в таблицу,и в строчку,нужно,чтобы когда уже было выведено 8 товаров на экран,9 товар начинался с новой строки,то есть нужен тег <tr>
Мой скрипт.
function addRow(id, value){
    var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0];
	    var td1 = document.createElement("TD")
	    td1.classList.add('border', 'price_class');
	    td1.appendChild(document.createTextNode(value))
	    tbody.appendChild(td1);
  }

addRow('priceTable', this.textContent);
Ответить с цитированием
  #2 (permalink)  
Старый 26.12.2018, 19:25
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

А где здесь TR? И как ячейку можно вставить в TBODY (tbody.appendChild(td1))?
Ответить с цитированием
  #3 (permalink)  
Старый 26.12.2018, 19:43
Аспирант
Отправить личное сообщение для SolomonRei Посмотреть профиль Найти все сообщения от SolomonRei
 
Регистрация: 05.04.2018
Сообщений: 77

Как-то вставилась)
Ответить с цитированием
  #4 (permalink)  
Старый 26.12.2018, 19:44
Аспирант
Отправить личное сообщение для SolomonRei Посмотреть профиль Найти все сообщения от SolomonRei
 
Регистрация: 05.04.2018
Сообщений: 77

Сам не знаю,как
Ответить с цитированием
  #5 (permalink)  
Старый 26.12.2018, 20:02
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от SolomonRei
Как-то вставилась)
Ячейка (TD) может быть только в строке (TR), которая уже может быть в теле таблицы (TBODY). Вставка же ячейки вне тега строки приведет к неожиданным результатам - таблица будет разбита. Если идет речь о вставке по условию, то где там добавляются товары не понятно, но если непосредственно в таблицу, то нужно добавить сначала в нее строку (TR), если последняя строка таблицы не имеет свободных ячеек, и уже в новую строку вставлять ячейку. Если же последняя строка таблицы имеет свободные ячейки (или имеет не все 8), то вводим текст в свободную ячейку или вставляем новую ячейку.
Ответить с цитированием
  #6 (permalink)  
Старый 26.12.2018, 20:07
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

SolomonRei,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  td{
      width: 50px;
      border: 1px solid #000000;
      text-align: center;
  }
  table{
      border-collapse: collapse;
  }

  </style>


</head>

<body>
<table id="priceTable"><tbody></tbody></table>
<script>
function addRow(id, value){
    var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0];
    var tr = tbody.querySelector("tr:last-child");
    if(!tr || tr.cells.length == 8) tr = tbody.insertRow(-1);
    var td1 = document.createElement("TD")
        td1.classList.add('border', 'price_class');
        td1.appendChild(document.createTextNode(value))
        tr.appendChild(td1);
  }
for (var i = 1; i < 12; i++) {
addRow('priceTable', i);

}


  </script>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 27.12.2018, 04:34
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

SolomonRei, и td1.classList.add('border', 'price_class') лишнее, ведь если заполняется одна таблица, то сразу прописать стили для ее ячеек в CSS, и даже если таблица имеет несколько TBODY, а ячейки товаров добавляются в первое, то для ячеек первой TBODY таблицы с классом "name".
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Отследить перенос строки Viral Элементы интерфейса 3 10.11.2016 12:04
Перенос элемента на новую строку maternik (X)HTML/CSS 2 01.03.2016 08:54
Если position absolute, а внутри margin в % - то перенос на другую строку... Petja (X)HTML/CSS 3 03.08.2013 20:26
по ctrl+Enter перенос курсора на след. строку Crux Internet Explorer 5 09.08.2010 15:30
как железно запретить перенос элемента на новую строку? constantant (X)HTML/CSS 6 14.08.2009 01:59