如何检测 JavaScript 是否被禁用?

IT技术 javascript html code-snippets
2021-01-25 02:58:28

今天早上有一篇帖子询问有多少人禁用了 JavaScript。然后我开始想知道可以使用哪些技术来确定用户是否禁用了它。

有谁知道一些简短/简单的方法来检测 JavaScript 是否被禁用?我的目的是发出警告,指出如果浏览器未启用 JS,该站点将无法正常运行。

最终,我想将它们重定向到能够在没有 JS 的情况下工作的内容,但我需要将此检测作为占位符来启动。

6个回答

我想在这里添加我的 .02。它不是 100% 防弹,但我认为它已经足够好了。

对我来说,问题是提供某种“如果没有 Javascript,此网站无法正常运行”消息的首选示例,那么您需要确保您的网站在没有 Javascript 的情况下也能正常运行。一旦你开始沿着这条路走下去,你就会开始意识到在关闭 JS 的情况下网站应该是防弹的,这是一大块额外的工作。

所以,你真正想要的是“重定向”到一个页面,上面写着“打开 JS,愚蠢的”。但是,当然,您不能可靠地进行元重定向。所以,这里的建议是:

<noscript>
    <style type="text/css">
        .pagecontainer {display:none;}
    </style>
    <div class="noscriptmsg">
    You don't have javascript enabled.  Good luck with that.
    </div>
</noscript>

...您网站中的所有内容都用“pagecontainer”类的 div 包裹。noscript 标签内的 CSS 将隐藏您的所有页面内容,而是显示您想要显示的任何“无 JS”消息。这实际上就是 Gmail 所做的……如果它对 Google 来说足够好,那么对于我的小网站来说也足够了。

是的,我想知道为什么我不能对您的答案投赞成票,因为我忘记激活我的 JS :-)) 我喜欢并实施您的解决方案!谢谢!
2021-03-19 02:58:28
@Kolors,我在 2012 年 3 月发表了该评论,我认为今天这是双重正确的。从那时起,我们有了 Meteor、Angular.Js、Famo.us 和大量惊人的库,这些库甚至都需要 Javascript 才能启动我确实想知道选择禁用 JS 的用户实际上是想实现什么……显然,他们和我们其他人浏览的不是同一个网站,而且公司没有理由需要缩小他们的网站以获得最小的规模顽固用户的子集...
2021-03-24 02:58:28
@Lee 一针见血,在划清您将支持的内容之前,您只能为用户做这么多。我们希望所有用户都拥有支持互联网的设备,我是否也应该为那些拒绝访问互联网的人实施我的网站的纸质版本?
2021-03-28 02:58:28
@steve 曾经尝试过验证 google.com 吗?验证只是确定文档与规格表的接近程度,它绝不会影响页面的可用性。
2021-03-30 02:58:28
@JonasGeiregat 如果您的 Web 应用程序已构建并且需要 Javascript 才能运行,那么强制用户需要 Javascript 有什么问题?我经常听到这个评论,但它只对最简单的网站有效。试试没有 JS 的 Facebook,看看会发生什么。如果您的应用程序是为 Javascript 构建的,那么无论如何要求 99% 的用户都已启用有什么问题?
2021-04-08 02:58:28

我假设您正在尝试决定是否提供 JavaScript 增强的内容。最好的实现会完全降级,因此该站点在没有 JavaScript 的情况下仍能运行。我还假设您的意思是服务器端检测,而不是<noscript>出于无法解释的原因使用该元素。

没有很好的方法来执行服务器端 JavaScript 检测。作为替代方案,可以使用 JavaScript 设置 cookie,然后在后续页面访问时使用服务器端脚本测试该 cookie。然而,这不适合决定要提供什么内容,因为它无法区分没有 cookie 的访问者与新访问者或不接受 JavaScript 设置的 cookie 的访问者。

如果您只对 <noscript> 标签中的给定元素使用 style 属性(例如 <noscript><div style="color:red;">blahblah</div></noscript> 或 sg. 类似),它仍然有效. 但是,如果您将 <style> BLOCK 通常放在定义某些 .noscript(或类似)分类元素的样式的标题中,并且在正文中,在 <noscript> 标签内,您只需为给定的元素提供之前定义的 .noscript 类,像这样:<noscript><div class="noscript">blahblah</div></noscript>
2021-03-13 02:58:28
<noscript> 是指定非 javascript 内容在语义上最准确的方法 - 与其检测 javascript 是否被禁用,不如检测它是否已启用。因此,默认情况下显示“您需要 javascript 才能正确使用我的网站”消息,但在加载时立即使用 javascript 函数将其隐藏。
2021-03-20 02:58:28
@matt lohkamp:或者甚至默认隐藏消息,并在其中放置一个<style><noscript>以取消隐藏(如果启用 JS,则不会在那里重排)。令人惊讶的是,这适用于所有现代浏览器,甚至适用于 IE6
2021-03-24 02:58:28
@matt - 我已经这样做了一段时间,但是在连接速度较慢的情况下,消息会持续一段时间,让用户感到困惑。我在这里寻找不同的解决方案。@Piskvor - 标题中的 <noscript> 标签不会验证,正文中的 <style> 标签不会验证。
2021-03-24 02:58:28
...除了你为什么关心验证?你验证只是为了验证吗?它可能不是“正确的”,但如果它可以工作并“在引擎盖下有一点污垢”完成它,那有什么问题?别担心,我不会判断;-)
2021-03-27 02:58:28

noscript 块在 JavaScript 被禁用时执行,通常用于显示您在 JavaScript 中生成的替代内容,例如

<script type="javascript">
    ... construction of ajaxy-link,  setting of "js-enabled" cookie flag, etc..
</script>
<noscript>
    <a href="next_page.php?nojs=1">Next Page</a>
</noscript>

没有 js 的用户将获得next_page链接 - 您可以在此处添加参数,以便您在下一页知道他们是通过 JS/非 JS 链接来的,还是尝试通过 JS 设置 cookie,如果没有,则意味着 JS被禁用。这两个示例都相当琐碎且易于操作,但您明白了。

如果您想了解有多少用户禁用了 javascript 的纯粹统计信息,您可以执行以下操作:

<noscript>
    <img src="no_js.gif" alt="Javascript not enabled" />
</noscript>

然后检查您的访问日志以查看此图像已被点击的次数。一个略显粗糙的解决方案,但它会为您的用户群提供一个按百分比计算的好主意。

上述方法(图像跟踪)不适用于纯文本浏览器或根本不支持 js 的浏览器,因此如果您的用户群主要转向该区域,这可能不是最佳方法。

您也可以将该图像作为服务器端脚本提供服务,设置 mime 类型,并使用它来记录有关用户的一些信息或放置 cookie... px.sklar.com/code.html/id=256
2021-03-14 02:58:28
根本不支持 JS 的浏览器会不会简单地忽略 noscript 标签并显示图像?
2021-03-30 02:58:28
请注意,如果您设置样式,IE8 和 noscript 标签目前存在一个错误...请参阅 positioniseeverything.net/explorer.html
2021-04-04 02:58:28
这不是很有效。例如,它不会计算任何使用纯文本浏览器的人,这些浏览器通常不支持 JavaScript。至少,您应该禁用该图像的缓存。
2021-04-05 02:58:28
@LKM:取决于它们的书写方式,很可能是这样,因此您可以将其设为 1x1px 点。该选项主要用于跟踪服务器端的使用模式,因此仍然可以,因为它是由没有 javascript 功能的用户触发的。
2021-04-05 02:58:28

这对我有用:如果 javascript 被禁用,它会重定向访问者

<noscript><meta http-equiv="refresh" content="0; url=whatyouwant.html" /></noscript>
这可能是无效的,但看看 Facebook 的代码,它在 <head> 部分使用了相同的解决方案 - 这并不意味着这是一个很好的解决方案,因为 Facebook 的代码远非有效代码,但它可能意味着它适用于许多用户的浏览器,这可能是一个重要方面。但确实没有真正建议这样做。这是他们的代码: <noscript> <meta http-equiv=refresh content="0; URL=/about/messages/?_fb_noscript=1" /> </noscript>
2021-03-14 02:58:28
IE9(至少)有一个设置“允许 META REFRESH”。我似乎关闭它的人不多,但大概那些不喜欢 javascript 的人会这样做,但如果你想要 100%,不是这个。
2021-03-17 02:58:28
这是无效的。noscript 元素不能包含元元素。我不相信这会在所有浏览器(包括您当前无法测试的未来浏览器)中可靠地工作,因为它们可能以不同的方式执行错误恢复。
2021-03-20 02:58:28
它在 HTML5 中有效。
2021-03-27 02:58:28
当试图在 Linkedin 上分享时,这会破坏链接,我们发现很难……这不是一个好主意。由于linkedin跟随元刷新,忽略Og标签等。
2021-04-05 02:58:28

我建议你通过编写不显眼的 JavaScript 来反其道而行之。

使您的项目功能适用于禁用 JavaScript 的用户,完成后,实施您的 JavaScript UI 增强功能。

https://en.wikipedia.org/wiki/Unobtrusive_JavaScript

@n611x007 - 不道德的事情隐藏在所有代码中,在每个设备中,无论是服务器端还是客户端。这不是代码的错,而是人的错。我发现反对 JS 的运动很讽刺,因为你仍然使用 3rd 方 ISP 连接到互联网,仍然使用带有 3rd 方硬件/固件的计算机,仍然使用 3rd 方注入可访问的不安全蜂窝网络,仍然拥有使用3rd 方未打补丁的操作系统,仍然使用使用 3rd 方全开放更新服务的纯平电视,等等。无论您是否在浏览器中关闭 JS,您始终是 MITM-ish 频道的受害者。
2021-03-16 02:58:28
“生命太短暂了。现在是 2012 年 - 启用 javascript 或回家!” 是在没有 JS 的情况下显示的完美小消息。登录只是为了告诉你@Yarin
2021-03-19 02:58:28
生命太短暂了。现在是 2012 年 - 启用 javascript 或回家
2021-03-25 02:58:28
@Yarin 我构建 PHP / JS 应用程序是为了谋生,我从不退缩......如果它对某人不起作用,他们会联系我,我告诉他们不要再活在过去并启用 JS。
2021-03-27 02:58:28
我也刚刚登录说这太棒了!@雅琳。我正在制作一个一般不会公开的小网站(考虑像一个内部网,但供朋友们聚在一起从事一个项目)。我正在把它变成一个 SPA,而不是费心去做后备。不显眼的 JavaScript 几乎会使我投入 SPA 概念的工作量增加一倍。使用现代 javascript 库(例如 Knockout、Jquery 等),我们必须接受并非每个站点都可以轻松变得“不引人注目”。Javascript 是网络的未来。
2021-04-03 02:58:28