检测浏览器是否禁用图像答案

【问题标题】：Detect if browser disables images检测浏览器是否禁用图像
【发布时间】：2015-07-31 15:45:03
【问题描述】：

我需要检测浏览器是否禁用了当前页面上的图像。这可以用 JavaScript (jQuery/Modernizr) 实现吗？

问题：该项目使用图像精灵作为图标并将它们显示为<i class="icon-user"></i>。该应用程序部分由移动用户使用，如果他们使用边缘冲浪，其中一些会禁用图像。结果，一些按钮消失了。

如果图像被阻止，我唯一需要的是显示 something（灰色正方形、圆形……）。通过 <html> 元素左右的 CSS 类（例如class="no-images"）。在<i>…</i> 之间写替代文本很遗憾没有选择。

感谢您的想法！我希望它存在一个简单的解决方案。

【问题讨论】：

网上已经有很多变通办法了，google怎么了？
可能是我用错了关键词，抱歉！我检查了多种组合。如果 js 被禁用，我得到的唯一结果是 <noscript> 主题。

标签： javascript jquery css image modernizr

【解决方案1】：

您可以使用以下脚本：

function noimage()
{
    if ((document.getElementById('flag').offsetWidth==1 
         && document.getElementById('flag').readyState=='complete')
         ||(document.getElementById('flag').offsetWidth==1
         && document.getElementById('flag').readyState==undefined))
    {
         var objHead = document.getElementsByTagName('head');
         var objCSS = objHead[0].appendChild(document.createElement('link'));
         objCSS.rel = 'stylesheet';
         objCSS.href = 'alt.css';
         objCSS.type = 'text/css';
    }
}

您需要以下 html 标记：

<body onload="noimage();">
<img id="flag" src="clear.gif" alt="">

只需将其添加到正文中即可。它的作用是检查 offsetWidth 属性以在浏览器顶部查找 1x1 像素图像。如果它返回 true，则表示图像已启用。

如果您需要更多信息，请转至here.

【讨论】：

谢谢！我用 !( ... ) 反转了 if 条件，并在 <html> 标签中添加了一个 CSS 类来处理 CSS。