javascript - 如果找不到背景图像，如何显示替代图像

Question

这是 fiddle - http://jsfiddle.net/gfWES/59/

当 background-image 指向找不到图像的位置时，我想显示位于以下位置的备用图像- http://fancyapps.com/fancybox/demo/1_b.jpg

最终，我必须在 knockout 中实现上述目标。

<td class="cell">
<div class="contact-photo" data-bind="click: $parent.onAlertClick, style: { backgroundImage:     $parent.photoUrl($data) }, css: { 'has-notifications': $parent.showAlert($data)}, onerror:alert('error')"></div>
</td>

在上面的代码中 - 如果“$parent.photoUrl($data)”指向一个图像不存在的 url，我想将“backgroundImage:”指向其他位置以显示任何替代图像。

Answer 1

检查图像是否存在的唯一方法是请求它。使用 jQuery 你会做一个 $.ajax({url:'somefile.png', type:'HEAD', error:image_does_not_exist});其中 image_does_not_exist 是一个回调函数。然后将 photoUrl 返回的值设置为默认值。