一個圖片連結<img src="" /> 想用js 判斷url是否有效如果404 就載入預設的圖片路徑

<img src="xxx" onerror="this.src=預設圖地址"/>

圖片標籤img的 onerror事件

<img src="pic.gif" onerror="javascript:this.src='預設圖地址';" alt="pic" />

分析：特別注意 onerror，當圖片不存在時，將觸發 onerror，而 onerror 中為 img 指定一個預設圖片。也就是說圖片存在則顯示 pic.gif，圖片不存在將顯示預設圖片。

存在的問題：如果預設圖片也不存在，則繼續觸發 onerror，導致迴圈，故出現錯誤。如果圖片存在，但網路很不通暢，也可能觸發 onerror。

解決方法：通過函式載入預設圖片，僅載入一次

<img src="abc.jpg" onerror="nofind()" />
<script type="text/javascript">
function nofind(){
  var img=event.srcElement;
  img.src="http://mat1.gtimg.com/cd/2017/home/nlogo0518.png"; //替換的圖片
  img.onerror=null; //控制不要一直觸發錯誤
}
</script>