26.11.2016, 11:20
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
Вывод изображения на экран.
Здравствуйте, помогите пожалуйста разобраться.Не могу вывести изображение на экран из цикла.
var pole=[
[0,0,1,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],] ;
for (var i=0;i<6;i++){
for (var j=0;j<10;j++){
if (pole[i][j]==0) {
pole[i][j]=new Image()
pole[i][j].src="trava.jpg"
pole[i][j].width="50"
pole[i][j].style.position="absolute"
pole[i][j].style.left=j*50+"px";
pole[i][j].style.top =i*70+"px";
pole[i][j].onload=function(){document.body.appendChild(pole[i][j])// не работает.
}}}}
pole[0][0].onload=function(){document.body.appendChild(pole[0][0])}// Работает
pole[5][9].onload=function(){document.body.appendChild(pole[5][9])}//работает
почему-то строка
pole[i][j].onload=function(){document.body.appendChild(pole[i][j])
в цикле не срабатывает. А та же строка вне цикла работает. В моём примере рисуется только верхний левый и нижний правый сегмент игрового поля. |
|
26.11.2016, 16:41
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
Сообщение от Rise
|
|
DlinniyZmey, pole - массивы чисел, числа это не переменные, а ты с ними обращаешься как с переменными, это не будет работать и вне цикла, получается так 0=new Image() 0.src="trava.jpg" 0.onload= и тд.
|
Но ведь вне цикла работает...
даже если вне цикла сделать так
var i=2; var j=2;
pole[i][j].onload=function(){document.body.appendChild(pole[i][j])}
то нарисуется поле 3.3...
Может быть подскажите , как сделать так , чтобы работало..? Просто я тут вообще в тупике. В идеале хочу сделать, чтобы прорисовка всех полей шла плавно через jQery , но пока даже так не могу вывести. |
|
26.11.2016, 18:27
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
выдаёт 60 [object HTMLImageElement] через запятую.
|
|
26.11.2016, 18:30
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
Разумеется это после цикла. Цикл отрабатывает, превращает нулики-числа в обьекты, но выводить их на экран не хочет. А вот сразу после цикла "в ручную" выводит каждый конкретный элемент.
|
|
26.11.2016, 19:05
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
Сообщение от Rise
|
|
DlinniyZmey, а ну да че та меня переклинило)) в общем .onload должен идти по коду перед .src
|
так?
<html>
<script>
var pole=[
[0,0,1,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],] ;
for (var i=0;i<6;i++){
for (var j=0;j<10;j++){
if (pole[i][j]==0) {
pole[i][j]=new Image()
pole[i][j].onload=function(){document.body.appendChild(pole[i][j])}// не работает.
pole[i][j].src="trava.jpg"
pole[i][j].width="50"
pole[i][j].style.position="absolute"
pole[i][j].style.left=j*50+"px";
pole[i][j].style.top =i*70+"px";
}}}
pole[0][0].onload=function(){document.body.appendChild(pole[0][0])}// Работает
pole[5][9].onload=function(){document.body.appendChild(pole[5][9])}// работает
Так не работает вообще. Даже пара сегментов внизу кода (0,0 и 5.9) не рисуются.
Последний раз редактировалось DlinniyZmey, 26.11.2016 в 19:14.
|
|
26.11.2016, 19:12
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
нет, пара рисуется, просто нужно было фигурную скобку перенести вслед за строкой. Сейчас исправлю.
|
|
27.11.2016, 07:06
|
|
Интересующийся
|
|
Регистрация: 07.08.2016
Сообщений: 14
|
|
|
Сообщение от Rise
|
DlinniyZmey,
pole[i][j].onload=function(){document.body.appendChild(this)}
|
Спасибо!!!! Так и не понял, что это было, но теперь всё работает!!!! |
|
28.11.2016, 10:57
|
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
DlinniyZmey,
что-то у вас с onload больно мудрено...
<script>
window.onload = function() {
var pole=[
[0,0,1,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],] ;
for (var i=0;i<6;i++){
for (var j=0;j<10;j++){
if (pole[i][j]==0) {
pole[i][j]=new Image()
pole[i][j].src="http://javascript.ru/cat/list/mobile.jpg"
pole[i][j].width="50"
pole[i][j].style.position="absolute"
pole[i][j].style.left=j*50+"px";
pole[i][j].style.top =i*70+"px";
document.body.appendChild(pole[i][j])// работает.
}}}}
</script>
<body></body>
|
|
|
|
