DB等の動的なデータから画像パスを取得してくるような作りのシステムの場合、取得してきた画像パスに紐付くファイルが存在しないケースがある事を想定して対応を入れる必要がある。
この場合の対応としては、IMGタグの中にonerrorイベントを入れ、その中で別の画像に差し替える処理を入れれば良い。
具体的には以下。
<img src="$img_src" onerror="errImg(this)">
<script type="text/javascript">
function errImg(obj){
var noImg = new Image();
// 変更する画像ファイルのパス
noImg.src = "./no_image.gif";
if (obj.src != noImg.src ) {
obj.src = noImg.src;
}
}
</script>
尚if文を入れているのは、もし変更する画像ファイルのパスが無い場合に延々とonerrorイベントが呼ばれてしまう為である。