Я использовал примеры из различных других вопросов о переполнении стека, и по какой-то причине это не работает для меня. Я сделал функцию для получения эскизов и возврата либо фактического пути к изображению, либо пути к изображению по умолчанию (без эскиза).
Используя как подход JQuery, так и класс изображений Javascript, я получаю 404 ошибки в отношении отсутствующих изображений в консоли, а найденные изображения не вызывают ошибок, но не отображаются. Может ли кто-нибудь указать, что я делаю неправильно?
В функции getThumbnail() "image_url" при записи в консоль отображается правильно. Когда я нахожусь в вызывающей функции и регистрирую возвращаемое значение, оно просто отображается как «неопределенное».
JQuery:
function getThumbnail(name)
{
var image_url = "images/" + name + ".jpg";
$.get(image_url)
.done(function()
{
return image_url;
})
.fail(function()
{
return "images/default.jpg";
})
}
Javascript:
function getThumbnail(name)
{
var image = new Image();
image.src = image_url;
image.onload = function()
{
return image;
}
image.onerror = function()
{
return "images/default.jpg";
}
}
Функция вызова:
$.each( cycle, function( key, value )
{
var mapIndex = key;
var mapValue = value;
var brick = "<div class='brick small'><a class='delete' href='#'>×</a><img src='" + getThumbnail(value) + "' /><h2><span>" + value + "</span></h2></div>";
$( ".gridly" ).append( brick );
});
onerror
выполняется, когда изображение не удалось загрузить, а не перед загрузкой, как запросил OP 18.11.2016