Как указать очерёдность событий не через setTimeout?
Здравствуйте.
Я получаю изображение, а затем пытаюсь получить его ширину:
$('.tech').append("<img src='/upload/" + data['name'] + "' class='" + data['id'] + " toimg'><p class='psize'></p></div>");
$('.psize').append($('.' + data['id']).get(0).naturalWidth);
Но по каким-то причинам я получаю ответ "0". Я так предполагаю, это связано с тем, что изображение ещё не успело создаться, а я уже пытаюсь получить его ширину. Если я установлю setTimeout, то всё будет работать, но это не самый красивый метод, так как за отведённое мной время изображение может не успеть подгрузиться и я опять получу "0". Опять же я теряю во времени, если изображение уже подгрузилось, а я жду непонятно чего. Подскажите, как указать очерёдность событий, чтобы в начале выполнился append в .tech, а затем append в .psize? |
new Promise((resolve, reject) => {
var img = new Image();
img.onload = () => resolve(img);
img.onerror = reject;
img.src - '/upload/' + data['name'];
}).then(
naturalWidth => {
$('.tech').append("<img src='/upload/" + data['name'] + "' class='" + data['id'] + " toimg'><p class='psize'></p></div>");
$('.psize').append(naturalWidth);
},
error => {
//картинка не загрузилась
}
)
|
Aetae,
строка 7 разве не так должна быть ({naturalWidth })=> { или скобки лишние? |
Не, парни, не пашет.
http://jsfiddle.net/89xc5zt4/ Я сделал вот таким образом:
$('.tech').append("<div class='imgwrap'><img src='/upload/" + data['name'] + "' class='" + data['id'] + " toimg'></div><p class='psize'></p>");
$('.' + data['id']).on('load', function(){
$('.psize').append($(this).get(0).naturalWidth);
});
|
рони, не, в 3 должно быть img.naturalWidth.
Писал на коленке не глядя, извиняюсь. :) |
| Часовой пояс GMT +3, время: 09:06. |