javascript
JS实现图片不存在时显示默认图片
每個網(wǎng)站都會有圖片的存在,很多時候我們需要在網(wǎng)頁上顯示各種各樣的圖片,當(dāng)圖片數(shù)量越來越多時,難免會出現(xiàn)圖片丟失的情況,當(dāng)某些圖片不存在時,網(wǎng)頁上的紅叉會顯得很難看,這時候我們可以選擇顯示默認(rèn)圖片來代替,這樣會顯得非常有人性化。
利用 image 對象的 onerror 事件來判斷,出錯則更換 image 對象的 src 為默認(rèn)圖片的 URL。
<img src="http://www.codetc.com/images/test.png" onerror="Javascript:this.src='http://www.codetc.com/tools/img/PHP.jpg' " ?/> ?JavaScript onerror 事件
使用 onerror 事件是一種老式的標(biāo)準(zhǔn)的在網(wǎng)頁中捕獲 Javascript 錯誤的方法。
只要頁面中出現(xiàn)腳本錯誤,就會產(chǎn)生 onerror 事件。如果需要利用 onerror 事件,就必須創(chuàng)建一個處理錯誤的函數(shù)。你可以把這個函數(shù)叫作 onerror 事件處理器 (onerror event handler)。這個事件處理器使用三個參數(shù)來調(diào)用:msg(錯誤消息)、url(發(fā)生錯誤的頁面的 url)、line(發(fā)生錯誤的代碼行)。
onerror=handleErrfunction handleErr(msg,url,l) {//Handle the error herereturn true or false }瀏覽器是否顯示標(biāo)準(zhǔn)的錯誤消息,取決于 onerror 的返回值。如果返回值為 false,則在控制臺 (JavaScript console) 中顯示錯誤消息。反之則不會。
下面的例子展示如何使用 onerror 事件來捕獲錯誤:
<html> <head> <script type="text/Javascript"> onerror=handleErr var txt="" function handleErr(msg,url,l) {txt="There was an error on this page.nn"txt+="Error: " + msg + "n"txt+="URL: " + url + "n"txt+="Line: " + l + "nn"txt+="Click OK to continue.nn"alert(txt)return true } function message() {adddlert("Welcome guest!") } </script> </head> <body> <input type="button" value="View message" onclick="message()" /> </body> </html>總結(jié)
以上是生活随笔為你收集整理的JS实现图片不存在时显示默认图片的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 用 VS2005 类设计器设计类
- 下一篇: html图片慢慢消失的事件,[Web前端