霹靂開發邦: 用javascript偵測破圖或失效連結

2009年7月7日星期二

曾經利用判斷圖的height和width來判斷圖片是否存在。

但那是個不好的做法。

常常會發現圖明明好好的，但是width或height老是偵測錯誤。

近幾天在網路上找到一個好方法，既簡單又快速。

以下是範例程式：

	<html>
	<head>
	</head>
	<body>
	<img src="http://pics.blog.yam.com/badimage.jpg" />
	<script>
	function hi(){
	var i=new Image();
	i.onerror=function(){alert('error and do something');};
	i.src="http://pics.blog.yam.com/badimage.jpg";
	}
	</script>
	<input type='button' value="test" onclick="hi();" />

	</body>
	</html>

view raw gistfile1.html hosted with ❤ by GitHub

當然，以上是最原始，最笨的寫法。可以改成用jQuery來偵測某一區塊(block)的圖檔，這就看你要怎麼去發揮了。

霹靂開發邦