Question

我需要在图像损坏的情况下加载默认图像。这也需要应用于动态图像。总是受到课程的限制。

我发现了一个类似的问题Jquery on image error not working on dynamic images?，但在我的情况下它似乎不适用于动态图像

$('img.myClass').on("error", function () {
    this.src = 'http://placehold.it/150x150&text=PLACEHOLDER';
});

$("button").click(function(){
    $('body').append('<img src="http://image_doesn-t_exist_url" class="myClass" />');
});

Answer 1

你可以将错误功能放入追加功能。

$('img.myClass').on("error", function () {
    this.src = 'http://placehold.it/150x150&text=PLACEHOLDER';
});

$("button").click(function(){
    $('body').append('<img src="http://image_doesn-t_exist_url" class="myClass" />');
    $('img').on("error", function () {
    this.src = 'http://placehold.it/150x150&text=PLACEHOLDER';
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<img src="http://placehold.it/150x150&text=img%20loaded" />
<img src="http://placehold.it/150x150&text=img%20loaded" />
<img src="http://placehold.it/150x150&text=img%20loaded" />
<img src="http://image_doesn-t_exist_url" class='myClass' />

<p>
<button>
Add Image
</button>
</p>

错误动态图像时加载默认图像

1 个答案: