用JavaScript检测浏览器是否打开图像显示

Junxiao Shi

2009-01-02

JavaScript能不能检测浏览器是否打开图像显示？看似一个非常简单的问题，但是网上却很难查到相关资料。大部分用户不会关闭图像显示，但是仍有少数非宽带用户关掉了图像。为了使网站变得更加人性化、具有更好的可用性，Web前端工程师有时需要通过JavaScript检测“显示图像”功能是否打开。

方法一：图像尺寸法

未指定width、height属性的<img>标签，在图片成功下载的情况下能从width、height属性中取得图片的真实尺寸，而图片功能未开启时则是一个固定的、比较小的尺寸(相当于那个“红叉”)。为此，可以插入一张尺寸较大的图片，然后读取width属性，如果尺寸与原图不符说明图片显示没有开启。

<!-- 插入Google的logo，图片宽度应为168px -->
<img id="__ImageSupport" src="http://www.google.cn/images/nav_logo4.png"
  style="position:absolute;visibility:hidden;z-index:-1;" alt=""/>
<script type="text/javascript">//<![CDATA[
function ImageSupport() {
  var m=document.getElementById('__ImageSupport');
  if (m && m.width > 100) return true;
  else return false;
}
//]]></script>

演示：图像尺寸法检测浏览器是否打开图像显示

(read more)