Javascript.RU

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

Заполнение таблицы массивом
Здравствуйте. Впервые по учёбе сталкиваюсь с JavaScrip, поэтому очень мало что в нём понимаю. Имею задание и кусочки кода, в результате объединения и дописывания которых должно получиться следующее:


Но у меня получается выводить лишь пустые клетки, как только я пытаюсь заполнить их цифрами из массива - не выводится ничего.
Вот мой код:
<!DOCTYPE html>
    <html lang="uk">
        <head>
            <meta charset="UTF-8">
            <title>JS Игра</title>
                <style>
                    #game td {
                    width: 50px; /* ширина клетки*/
                    height: 50px; /* высота клетки */
                    border: 1px solid black; /*рамка вокруг клеток*/
                    text-align: center; /*выравнивание тексту в клетке*/
                    cursor: pointer; /*смена курсора над клеткой*/
                    }
                   .active {
                    background-color: lightgreen;
                    }
                </style>
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>        
        </head>
        <body>
            <div id="game">
                <table class="field">
                </table>
            </div>
            <script>



                function drawGameFields(size) {
                    var field = $('.field');
                    var from = 1;
                    var to = Math.pow(size, 2);
                    var arr = [];
                    arr = createArr(from, to);
                    createCells(arr, size, field);
                }

                function createArr(from, to) { //создаём массив чисел
                    var arr = [];
                    for (var i = from; i <= to; i++) {
                    arr.push(i); //добавляем к массиву число
                    }
                    arr.sort(function compareRandom(a, b) { // перемешиваем массив
                    return Math.random() - 0.5;
                    });
                    return arr; // возвращаем готовый массив
                }

                function createCells(size, elem, arr) {
                    elem.html(function(index, element) {
                    var content = '';
                    var e = 0; //начальный индекс массива
                    for (var i = 0; i < size; i++) {
                    content += '<tr>';
                    for (var j = 0; j < size; j++) {
                    content += '<td>' + arr[e] + '</td>'; // добавляем число
                    e++; // увеличиваем индекс массива
                    }
                    content += '</tr>';
                    }
                    return content; //возвращаем построенное поле
                    });
                }

                var startSize = 3;
                drawGameFields(startSize);

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

Whynotia,
строка 35 исправить!, смотреть на строку 49
Ответить с цитированием
  #3 (permalink)  
Старый 08.04.2021, 13:57
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

Как бы, если вы учитесь, то вряд ли надо за вас писать.
Поэтому начну с ошибок.
Разберитесь в функции

function createCells(size, elem, arr) {

Что какой параметр означает, И где какие параметры в вызове этой функции (строка 35)
createCells(arr, size, field);
Ответить с цитированием
  #4 (permalink)  
Старый 08.04.2021, 16:05
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Whynotia
var to = Math.pow(size, 2);
var to = size * size;
Ответить с цитированием
  #5 (permalink)  
Старый 08.04.2021, 16:06
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Whynotia
var arr = [];
arr = createArr(from, to);
var arr = createArr(from, to);
Ответить с цитированием
  #6 (permalink)  
Старый 08.04.2021, 16:11
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Whynotia
var from = 1;
Работа с этой переменной вообще отдельная тема...
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Заполнение таблицы автоматически maksmkv Элементы интерфейса 1 21.11.2017 00:48
Заполнение таблицы Hisot Элементы интерфейса 33 15.07.2013 21:16
Заполнение таблицы на JavaScript freeze123 Opera, Safari и др. 4 08.04.2013 09:42
заполнение comboBox из sql таблицы ynijar ExtJS 2 18.02.2013 22:47
Заполнение таблицы с помощью AJAX x][x AJAX и COMET 11 08.05.2009 19:58