代码之家 › 专栏 › 技术社区 › Anthony

在head中添加noscript以包装重定向的有效方法

noscript xhtml html javascript

Anthony · 技术社区 · 16 年前

因此,我想一个简单的方法来处理浏览器禁用javascript的问题,如下所示:

<head>
        <title>JavaScript Test</title>
        <noscript>
                <meta http-equiv="Refresh"
                        content="1;url=nojs.html" />
        </noscript>
</head>

nojs.html

<p>Return to <a href="jstest.html">test</a> after enabling javascrpt.</p>

在崩溃页面。

这不是我喜欢的方法,但它很好而且简单,直到可以为没有javascript的用户设计出更优雅的方法。

但是,将 <noscript> 中的元素 head 节。当然,初步测试还是有效的,但我迷信我的代码是否有效,而且我不希望它在现场测试中失败。

noscript 在另一个元素中,比如对象标记?或者我没想到的更简单的方法?

6 回复 | 直到 16 年前

Doug Neiner 16 年前

我不知道为什么你需要重定向到另一个页面,而不仅仅是显示一条消息。我使用JS和一些CSS来处理这些情况。大概是这样的:

<head>
   ....
   <script type="text/javascript"> document.documentElement.className += " js"</script>

   <link rel="stylesheet" type='text/css' href="css/layout.css" media="all" />
</head>
<body>
    <div id="noscript">Please enable JavaScript, then refresh this page. JavaScript is required on this site</div>
    <div id="wrapper">
       ...
    </div>
</body>

然后在 layout.css

 #wrapper      { display: none  } /* Hide if JS disabled */
 .js #wrapper  { display: block } /* Show if JS enabled */
 .js #noscript { display: none  } /* Hide if JS enabled */

html 要素之前

Spycho 15 年前

Doug的解决方案相当不错,但也有一些缺点:

html元素上的class属性无效。相反,使用身体。
它要求您知道要将元素设置为什么显示类型(即“ .js #wrapper { display: block }

<html>
    <head>
        <!-- put this in a separate stylesheet -->
        <style type="text/css">
            .jsOff .jsOnly{
                display:none;
            }
        </style>
    </head>

    <body class="jsOff">
        <script type="text/javascript">
            document.body.className = document.body.className.replace('jsOff ','');
        </script>

        <noscript><p>Please enable JavaScript and then refresh the page.</p></noscript>

        <p class="jsOnly">I am only shown if JS is enabled</p>
    </body>
</html>

这样,它就是有效的html(html元素上没有class属性)。它更简单(更少CSS)。它很灵活。只需将“jsOnly”类添加到您只想在启用JS时显示的任何元素中。

Peter Di Cecco 16 年前

这个 <noscript> <head> ,它一定在 <body>

您可以用另一种方法来实现,第一个页面是nojs.html,在该页面上使用javascript重定向到主内容。

Samuel Neff 16 年前

如果你真的想要一个有效的方法来做这件事,让你的主页成为 nojs.htm 页面并使用JS隐藏所有内容,然后再显示给用户,并使用javascript立即重定向到真正的主页。

levik 16 年前

我喜欢道格的解决方案。然而,如果您需要重定向,我会记得,虽然有一个规范和标准,但web浏览器的世界是一个肮脏、不完美的世界。规范是否允许某些内容并不重要,重要的是它是否在您关心的浏览器集中工作。

只要看看任何主要网站的源代码。。。我敢打赌,他们中的大多数不会验证:)

Giona 15 年前

那么:

noscript{
z-index:100;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
min-height:1024px; background:#FFF;
}

<noscript>
<p>Please <a href="no_js_instructions.php">enable Javascript</a> on your browser.</p></noscript>