Поместить слова в сетку таблицы в головоломке поиска слов? - PullRequest
Новая
       13

Поместить слова в сетку таблицы в головоломке поиска слов?

3 голосов
/ 21 ноября 2011

Я пытаюсь создать головоломку для поиска слов, сгенерированную скриптом.Слова должны быть расположены горизонтально, вертикально или по диагонали.Мне может понадобиться установить, разрешено ли им чтение только вперед или назад.У меня есть множество слов, таких как (яблоко, банан, виноград, лимон, груша), которые должны быть размещены в таблице.Я уже создал таблицу, но я застрял в том, как разместить слова в сетке.

Я ищу примеры с некоторыми пояснениями.

Пожалуйста, смотрите мой код ниже: 

var wordsList =[
"apple", 
"banana", 
"grape", 
"lemon", 
"pear" ];  

var cells = 10; // Numbers of cells horizontally and vertically in table grid
var cellSize = 15; // in pixels
var cellSpace = 2; // cell spacing in pixels

function createPuzzleTable(cells) {

    var totalNumRows = "";
    var totalNumColumns = "";

    //creating rows
    for (r=1;r<=cells;r++){
        //creating cells
        var oneCell = "<td width='" + cellSize + "' height='"+ cellSize + "'><input name='charField' type='text' /></td>";
        totalNumRows += oneCell;
    }

    //creating columns
    for (c=1;c<=cells;c++){ 
        totalNumColumns += "<tr>" + totalNumRows + "</tr>";
    }       
    var puzzleTableContent = "<div id='puzzleCont'><table id='puzzleTable' border='0' cellspacing='" + cellSpace +"' cellpadding='0'>"+ totalNumColumns +"</table></div>";

$("#wPuzzle").append(puzzleTableContent);

}

createPuzzleTable(cells);

Ответы [ 2 ]

1 голос
/ 30 марта 2012

Уже есть виджет jquery, который делает это: http://code.google.com/p/jquery-wordsearch-game/

Посмотрите на этот код .Он использует шаблон стратегии для размещения слов в сетке вперед, назад, вверх, вниз и в обоих диагональных направлениях.В частности, посмотрите на строку 547 и далее.

Поскольку обучение - это ваша сильная сторона, вы можете найти его забавным ... и, возможно, придумаете еще лучший способ сделать это.

1 голос
/ 21 ноября 2011

Во-первых, вам нужно установить простой способ определения местоположения элементов в вашей сетке.Используйте имена классов: 

<input name='charField' class="r_2 c_3" type='text' />

Где "r_" представляет строки и столбцы "c_".

Затем случайным образом выберите направление и местоположение (строка, столбец).Посмотрите, подойдет ли слово и что квадрат еще не занят, в противном случае выберите снова.

Затем поместите буквы в сетку, используя систему координат r_ c_.

Повтор.1011 * Заполнить незанятые ячейки псевдослучайными данными заполнителя.

...