Javascript.RU

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

заполнить поля массива по значению.
Добры день, господа
Суть в следующим. Нужно заполнять поля массива, == "2" вставлять <div><img></div>

Сам массив

var mazePacman  = [
    [2, 2, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 2, 2],//0
    [2, 0, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 0, 2],//1
    [2, 2, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 2, 2],//2
    [0, 0, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 0, 0],//3
    [2, 2, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 2, 2],//4
    [2, 0, 0, 0, 2, 2, 2, 2, 2, 2, 0, 0, 0, 2],//5
    [2, 2, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 2, 2],//6
    [0, 0, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 0, 0],//7
    [0, 0, 2, 0, 1, 1, 1, 1, 1, 1, 0, 2, 0, 0],//8
    [0, 0, 2, 0, 1, 0, 0, 0, 0, 1, 0, 2, 0, 0],//9
    [0, 0, 2, 2, 1, 1, 1, 1, 1, 1, 2, 2, 0, 0],//10
    [0, 0, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 0, 0],//11
    [0, 0, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 0, 0],//12
    [2, 2, 2, 2, 2, 2, 0, 0, 2, 2, 2, 2, 2, 2],//13
    [2, 0, 0, 0, 0, 2, 0, 0, 2, 0, 0, 0, 0, 2],//14
    [2, 2, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 2, 2],//15
    [0, 0, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 0, 0],//16
    [2, 2, 2, 0, 2, 2, 0, 0, 2, 2, 0, 2, 2, 2],//17
    [2, 0, 2, 0, 0, 2, 2, 2, 2, 0, 0, 2, 0, 2],//18
    [2, 2, 2, 2, 2, 2, 0, 0, 2, 2, 2, 2, 2, 2] //19


];



создание таблицы, где if проверяет, если поле ==2, то аппендить данный элемент

function createTable(){
    $('#main_container').append('<table border="" class="square-Pacman"></table>');
    for (var i = 1000; i <= 1019; i++){
        $('.square-Pacman').append('<tr>'+createRows(i)+'</tr>')
    }

if (mazePacman [settings.y][settings.x] == 2) {
        $('#main_container').append('<div  class="eat" id="eat"><img src="img/eat.gif" height="13" width="13"></div>');
    } else {}

function createRows(number){
        var rows = [];
        for (var i = 1; i <= 14; i++){
            rows[i] = '<td  id="line_'+number+i+'"></td>';

        }

        return rows.join('');

    }
}};


Он вставляет картнику, но только 1 раз и не в массив, а ровно под ним
Ответить с цитированием
  #2 (permalink)  
Старый 02.03.2015, 15:10
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Наверное вставить не в массив, а в таблицу создаваемую? А добавляется под ней потому как вы сами ее туда вставляете:

$('#main_container').append .... то есть после таблицы.

И вообще, это слишком накладно 1020 раз append(). Сформируйте строку содержащую html-код таблицы созданной, а затем вставьте ее:

$('#main_container').html(table)

Если индексы массива [settings.y][settings.x] не изменяются, то сравнение только по этой ячейке будет, что в остальных не так и важно уже. А разве так должно быть, если задача стоит Нужно заполнять поля массива, == "2"?
Ответить с цитированием
  #3 (permalink)  
Старый 02.03.2015, 15:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Arx777,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  .eat {
    background-image:  url(http://wwww.lenagold.ru/fon/kam/kampl/chb/kampl33.jpg);
  }
  .water {
    background-image:  url(http://static.hdw.eweb4.com/media/thumbs/1/97/961788.jpg);
  }
   td {
      height: 25px;
      width: 30px;
      background-image:  url(http://pics.geekweekgerman.de/2012/05/bg_gras041-150x150.gif);
      border: none;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
      var mazePacman  = [
    [2, 2, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 2, 2],//0
    [2, 0, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 0, 2],//1
    [2, 2, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 2, 2],//2
    [0, 0, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 0, 0],//3
    [2, 2, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 2, 2],//4
    [2, 0, 0, 0, 2, 2, 2, 2, 2, 2, 0, 0, 0, 2],//5
    [2, 2, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 2, 2],//6
    [0, 0, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 0, 0],//7
    [0, 0, 2, 0, 1, 1, 1, 1, 1, 1, 0, 2, 0, 0],//8
    [0, 0, 2, 0, 1, 0, 0, 0, 0, 1, 0, 2, 0, 0],//9
    [0, 0, 2, 2, 1, 1, 1, 1, 1, 1, 2, 2, 0, 0],//10
    [0, 0, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 0, 0],//11
    [0, 0, 2, 0, 2, 0, 0, 0, 0, 2, 0, 2, 0, 0],//12
    [2, 2, 2, 2, 2, 2, 0, 0, 2, 2, 2, 2, 2, 2],//13
    [2, 0, 0, 0, 0, 2, 0, 0, 2, 0, 0, 0, 0, 2],//14
    [2, 2, 2, 0, 2, 2, 2, 2, 2, 2, 0, 2, 2, 2],//15
    [0, 0, 2, 2, 2, 0, 0, 0, 0, 2, 2, 2, 0, 0],//16
    [2, 2, 2, 0, 2, 2, 0, 0, 2, 2, 0, 2, 2, 2],//17
    [2, 0, 2, 0, 0, 2, 2, 2, 2, 0, 0, 2, 0, 2],//18
    [2, 2, 2, 2, 2, 2, 0, 0, 2, 2, 2, 2, 2, 2] //19
];
  var table = $("<table/>", {
    "class": "square-Pacman",
    "cellSpacing": 0
});
$.each(mazePacman, function(indx, el) {
    var tr = $("<tr/>").appendTo(table);
    $.each(el, function(indx, elem) {
        $("<td/>", {
            "class": elem == 2 ? "eat" : elem == 1 ? "water" : ""
        }).appendTo(tr)
    })
});
table.appendTo("#main_container");
});


  </script>
</head>

<body>
<div id="main_container"></div>

</body>

</html>

Последний раз редактировалось рони, 02.03.2015 в 15:43.
Ответить с цитированием
  #4 (permalink)  
Старый 02.03.2015, 15:57
Интересующийся
Отправить личное сообщение для Arx777 Посмотреть профиль Найти все сообщения от Arx777
 
Регистрация: 20.02.2015
Сообщений: 25

laimas,
рони,
Всем спасибо. Решил следующим способом.)

function createTable(){
    $('#main_container').append('<table border="" class="square-Pacman"></table>');
    for (var i = 1000; i <= 1019; i++){
        $('.square-Pacman').append('<tr>'+createRows(i)+'</tr>')
    }

for(var i=0;i<=19;i++) {
        for(var j=0;j<=13;j++) {
            x = i * 27+7;
            y = j * 27+7;
            if(mazePacman[i][j] == 2) {
                console.log(i + ':' + j + ':' + mazePacman[i][j]);
                $('#main_container').append('<div id="_' + (i * 100 + j) + '" class="eat"><img src="img/eat.gif" height="13" width="13"></div>');
                $('#_' + (i * 100 + j)).css({'top': x, 'left': y});

            }
        }
    }

 function createRows(number){
        var rows = [];
        for (var i = 1; i <= 14; i++){
            rows[i] = '<td  id="line_'+number+i+'"></td>';

        }

        return rows.join('');

    }
}};
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Отправка по Ajax массива значений поля input hrundel jQuery 10 25.04.2014 22:13
Как динамически создавать поля и записать значения с массива ? Sergios90 Общие вопросы Javascript 7 19.11.2013 18:34
Вывод содержимого ячейки массива = значению счетчика cccp.world Events/DOM/Window 5 30.10.2013 09:06
Андроид браузер: невозможно заполнить всплывающие поля GuardCat Сайт Javascript.ru 0 27.11.2012 19:37
callback получить и заполнить 2 поля Viper jQuery 3 01.09.2009 14:20