Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.12.2017, 01:52
DVV DVV вне форума
Кандидат Javascript-наук
Отправить личное сообщение для DVV Посмотреть профиль Найти все сообщения от DVV
 
Регистрация: 26.12.2017
Сообщений: 125

Раскрасить ячейки таблицы, созданной через JS
Нужно раскрасить ячейки таблицы путем выбора случайных оттенков в HEX из массива. Но код на работает. В чем ошибка не могу понять. Заранее благодарен за помощь!

<script>

    var colorArray = ["#CD5C5C", "#7FFF00", "#228B22", "#FFA07A", "#FFFF00", "#008B8B", "#4682B4", "#FFA500", "#0000FF", "#D2691E"];
    ;(function () {
        function drawTable(row, col) {

            var elem = document.getElementById('colorId');
            var num;
            var html = "<table>";


            for (var i = 0; i < row; i++) {
                html += "<tr>";
                for (var j = 0; j < col; j++) {
                    html += "<td id='colorId'>";
                    num = Math.round(Math.random() * 5);
                    elem.style.background = colorArray[num];
                    html += "</td>";
                }
                html += "</tr>";
            }

            html += "</table>";

            return html;

        }


        var columns = prompt("Введите кол-во колонок");
        while (isNaN(columns) || columns < 1 || columns * 10 % 10 !== 0) {
            columns = prompt("Некорректные данные! Введите кол-во колонок");
        }
        var rows = prompt("Введите кол-во строк");
        while (isNaN(rows) || rows < 1 || rows * 10 % 10 !== 0) {
            rows = prompt("Некорректные данные! Введите кол-во строк");
        }

        document.write(drawTable(rows, columns));
    })();


</script>
Ответить с цитированием
  #2 (permalink)  
Старый 26.12.2017, 09:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

DVV,
строки 7 и 17 зачем в вашем коде elem - создавали строку, так создавайте.
строки 7 и 17 выкинуть, строку 15 переписать,строки 15 - 16 поменять местами
Ответить с цитированием
  #3 (permalink)  
Старый 26.12.2017, 12:43
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

DVV,
<!DOCTYPE html>

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

  </style>

</head>

<body>
<script>

    var colorArray = ["#CD5C5C", "#7FFF00", "#228B22", "#FFA07A", "#FFFF00", "#008B8B", "#4682B4", "#FFA500", "#0000FF", "#D2691E"];
    ;(function () {
        function drawTable(row, col) {


            var num;
            var html = "<table>";


            for (var i = 0; i < row; i++) {
                html += "<tr>";
                for (var j = 0; j < col; j++) {
                    num = Math.floor(Math.random() * colorArray.length);
                    html += "<td style='background-color: "+colorArray[num]+";'>";
                    html += "</td>";
                }
                html += "</tr>";
            }

            html += "</table>";

            return html;

        }


        var columns = prompt("Введите кол-во колонок");
        while (isNaN(columns) || columns < 1 || columns * 10 % 10 !== 0) {
            columns = prompt("Некорректные данные! Введите кол-во колонок");
        }
        var rows = prompt("Введите кол-во строк");
        while (isNaN(rows) || rows < 1 || rows * 10 % 10 !== 0) {
            rows = prompt("Некорректные данные! Введите кол-во строк");
        }

        document.write(drawTable(rows, columns));
    })();


</script>


</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 26.12.2017, 13:08
DVV DVV вне форума
Кандидат Javascript-наук
Отправить личное сообщение для DVV Посмотреть профиль Найти все сообщения от DVV
 
Регистрация: 26.12.2017
Сообщений: 125

Спасибо большое! Все работает)))
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вывести через JS данные lmi2002 AJAX и COMET 4 29.05.2017 13:39
Как сделать tooltip для ячейки таблицы? khusamov ExtJS 7 14.04.2017 10:52
Ввод дат в ячейки таблицы AlexMal43 Элементы интерфейса 11 10.04.2015 16:24
eMail через JS konstantinopol Общие вопросы Javascript 15 12.01.2015 10:06
Вставка HTML кода и JS кода через innerHTML zhurchik AJAX и COMET 1 31.10.2014 17:32