<bdo id="vljxk"><rt id="vljxk"><noframes id="vljxk"><noframes id="vljxk"><noframes id="vljxk"><rt id="vljxk"></rt><rt id="vljxk"></rt><noframes id="vljxk"><rt id="vljxk"><delect id="vljxk"></delect></rt><noframes id="vljxk"><rt id="vljxk"></rt><noframes id="vljxk"><noframes id="vljxk"><rt id="vljxk"></rt>

當前位置:首頁 >  站長 >  編程技術 >  正文

HTML中圖片不存在顯示默認圖片的方法示例

 2020-10-15 11:11  來源: 腳本之家   我來投稿 撤稿糾錯

  阿里云優惠券 先領券再下單

這篇文章主要介紹了HTML中圖片不存在顯示默認圖片的方法示例,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧

一個圖片鏈接<img src="" />想用js 判斷url是否有效如果404 就加載默認的圖片路徑

<img src="xxx" οnerrοr="this.src=默認圖地址"/>

圖片標簽img的 onerror事件

<img src="pic.gif" οnerrοr="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>

到此這篇關于HTML中圖片不存在顯示默認圖片的方法示例的文章就介紹到這了,更多相關HTML圖片不存在顯示默認內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關文章,希望大家以后多多支持腳本之家!

來源:腳本之家

鏈接:https://www.jb51.net/web/740948.html

申請創業報道,分享創業好點子。點擊此處,共同探討創業新機遇!

相關標簽
圖片不存在

相關文章

熱門排行

信息推薦