-1

我在页面上使用了很多加载到 DOM 中的图像，例如

html += '<img src="'+image.preview+'" title="View larger image" alt="'+image.item_title+'" height="'+image.display_height+'" width="'+image.display_width+'">';

数据来自 ajax 调用并且在 FOR 循环中，每个图像一个。我有两个图像参考，以防一个被破坏image.preview并且image.preview2（我使用两个，因为 image.preview 是本地的，但如果出现错误，那么 image.preview2 是原始图像）

如果image.preview坏了我想切换到image.preview2

我正在尝试以下但不确定将其放置在哪里？

$('img').on('error', function() { this.src = image.preview2; });

我在之前，之后，中间都试过html +=，但似乎没有任何效果 - 有什么想法吗？

4

4 回答 4

1

如果preview2图像源对于每个图像都不同，那么我建议在for循环中这样做：

for(n in images) {
    var image = images[n];

    // create jQuery object (is not in the DOM jet)
    $img = $('<img title="View larger image" alt="' + image.item_title + '" height="' + image.display_height + '" width="' + image.display_width + '">');

    // is there an preview src?
    if(typeof image.preview == 'Undefined' || image.preview == '') { //nopes
        $img.attr('src', image.preview2);
    } else { //yes
        $img.attr('src', image.preview);
    }

    // add the image to the DOM
    $('#id_of_element').append($img);
}
于 2013-02-22T08:51:20.727 回答
0

例子：

function setDefaultImage(img)
{
  img.src = "images/candidates/human.jpg";
}

希望对你有帮助..

在你的场景中..

html += '<img src="'+image.preview+'" title="View larger image" alt="'+image.item_title+'" height="'+image.display_height+'" width="'+image.display_width+'" onerror="'setDefaultImage(this)'">';

 function setDefaultImage(img)
    {
      img.src = "image.preview2";
    }
于 2013-02-22T08:51:37.730 回答
0

你可以做：

var newImg = $('<img src="'+image.preview+'" title="View larger image" alt="'+image.item_title+'" height="'+image.display_height+'" width="'+image.display_width+'">');
newImg.on('error', function() { this.src = image.preview2; }); 

and then

<the html container>.append(newImg);

这将确保您的图像在添加到 dom 并获取之前具有所有设置。

于 2013-02-22T08:50:13.497 回答
-2

找出最简单的方法是内联：

html += '<img src....onerror="this.onerror=null;this.src=\''+image.preview2+'\';">';
于 2013-02-22T10:45:30.377 回答