javascript - jQuery / JavaScript替换损坏的图像(jQuery/JavaScript to replace broken images)

Question

I have a web page that includes a bunch of images.

(我有一个包含一堆图像的网页。)

Sometimes the image isn't available, so a broken image is displayed in the client's browser.

(有时，该图像不可用，因此在客户端的浏览器中会显示损坏的图像。)

How do I use jQuery to get the set of images, filter it to broken images then replace the src?

(如何使用jQuery获取图像集，将其过滤为损坏的图像然后替换src？)

---

--I thought it would be easier to do this with jQuery, but it turned out much easier to just use a pure JavaScript solution, that is, the one provided by Prestaul.

(-我认为使用jQuery会更容易，但是事实证明，仅使用纯JavaScript解决方案（即Prestaul提供的解决方案）要容易得多。)

  ask by Dan Lord translate from so

Answer 1

Handle the onError event for the image to reassign its source using JavaScript:

(处理onError事件以使图像使用JavaScript重新分配其源：)

function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}

<img src="image.png" onerror="imgError(this);"/>

Or without a JavaScript function:

(或没有JavaScript函数：)

<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />

The following compatibility table lists the browsers that support the error facility:

(以下兼容性表列出了支持错误工具的浏览器：)

http://www.quirksmode.org/dom/events/error.html

(http://www.quirksmode.org/dom/events/error.html)