如何使用 jQuery 或 JavaScript 替換損壞的映像？

使用jQuery 或JavaScript 替換損壞的圖像

網頁通常依賴圖像，處理圖像不可用的情況至關重要並出現破碎的圖像。本文探討了解決此問題的兩種方法：使用 jQuery 函式庫和純 JavaScript 解決方案。

jQuery 方法

儘管最初考慮用於此任務，但 jQuery 方法事實證明不太簡單。要使用 jQuery 實現此目的，您需要：

• 使用 jQuery 的 $() 取得影像集。
• 使用 .filter() 方法過濾損壞的影像。
• 使用替換損壞的映像src .attr().

純JavaScript 解決方案

使用純JavaScript 的替代方法更簡單、更有效率。透過處理影像的 onError事件，您可以重新分配其來源：

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

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

或者，您可以在不使用函數的情況下實現此功能：

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

相容性注意事項

需要注意的是，瀏覽器對錯誤工具的支援可能會有所不同。有關兼容性詳細信息，請參閱原​​始答案中提供的參考：http://www.quirksmode.org/dom/events/error.html

以上是如何使用 jQuery 或 JavaScript 替換損壞的映像？的詳細內容。更多資訊請關注PHP中文網其他相關文章！