OnError圖像內處理回聲

Question

我試圖處理從omdbapi.com拉出的404圖像，但我的代碼不起作用。我通過一個數組循環來構建一個電影列表。

echo '<a href="'.$oIMDB->getUrl().'" target="_new"><img class="img-responsive img-thumbnail posterImage" onError=\"this.onError=null;this.src='error.png'; this.onclick=null;\" src="https://img.omdbapi.com/?i=' . $user['imdbID'] . '&apikey=secret" height="300"></a>';

當我檢查在Chrome的代碼，它看起來像這樣：

<img class="img-responsive img-thumbnail posterImage" this.onclick="null;\&quot;" height="300" data-pagespeed-url-hash="282594047" src="https://img.omdbapi.com/?i=tt5898034&amp;apikey=secret" onerror="this.onerror=null;pagespeed.lazyLoadImages.loadIfVisibleAndMaybeBeacon(this);" data-pagespeed-lazy-replaced-functions="1">

首先，我認爲這個問題是跟單/ echo中的雙引號，但後來我看到lazyload出現在onerror的中間。

是lazyload以某種方式引起該問題？我沒有故意在我的網頁上加入lazyload。也許它包含jQuery時默認開啓？

任何輸入將不勝感激！

Answer 1

function imageError(e){ 
 
\t e.setAttribute("src","error.png"); 
 
\t e.removeAttribute("onError"); 
 
\t e.removeAttribute("onclick"); 
 
}

添加JavaScript代碼到您的項目並編輯PHP：

echo '<a href="'.$oIMDB->getUrl().'" target="_new"><img class="img-responsive img-thumbnail posterImage" onError="imageError(this)" src="https://img.omdbapi.com/?i=' . $user['imdbID'] . '&apikey=secret" height="300"></a>'; 

OR

您可以編輯PHP這樣的（無添加自定義JavaScript功能）：

echo '<a href="'.$oIMDB->getUrl().'" target="_new"><img class="img-responsive img-thumbnail posterImage" onError="this.setAttribute("src","error.png");this.removeAttribute("onError");this.removeAttribute("onclick");" src="https://img.omdbapi.com/?i=' . $user['imdbID'] . '&apikey=secret" height="300"></a>';