2013-03-05 113 views
15

如果在客户端禁用javascript,我想标记消息。我在这里搜索,发现<noscript>标签用于处理这个东西。如果在客户端使用noscript标记禁用javascript,则显示消息

我在w3schools编辑器做了这个检查,但它的不工作让我知道这个<noscript>是不是为了这个或这个部分我缺少的东西吗?

enter image description here

+0

W3Schools的可能使用JavaScript来填充结果字段。如果它被禁用,它不能这样做。只需创建一个HTML页面并将其加载到浏览器中即可。 – 2013-03-05 08:43:39

+11

您不应该使用W3Schools编辑器进行测试和开发。这是您的第一个问题 – Bojangles 2013-03-05 08:43:45

+1

这不是问题的答案,但请阅读http://w3fools.com/ – Ziinloader 2013-03-05 08:43:53

回答

33

试试这个: -

How to detect JavaScript is disabled in browser? 

正如我们所知,标记用于JavaScript。同样的方式,当JavaScript在浏览器中被禁用时,会有标签进入操作状态。

<script>Put Sample code here for execution when JavaScript is Active </script> 
<noscript>Put Sample code here for execution when JavaScript is Disabled</noscript> 

如何处理在浏览器禁用了JavaScript?

当JavaScript被禁用时,试图重定向到某个页面,在那里我们可以显示JavaScript被禁用的消息。 HTML中有一个名为“元刷新”的元标记,它将用户在该标题中指定的时间间隔内重定向到另一个页面。由于我们可以在noscript里面看到上面的代码,有一个间隔为“0”秒的“元刷新”标签。由于JavaScript在该页面被禁用,浏览器会被重定向到“ShowErrorPage.html”以显示一些警告消息。

我希望这会帮助你。

+0

非常有用,谢谢 – jonathanwiesel 2013-10-11 15:00:47

+0

@jonathanwiesel:谢谢亲爱的,它是我的荣幸。 – Rubyist 2013-10-12 20:30:36

+1

如果__meta重定向被禁用_ – 2014-09-10 11:46:59

1

放置 '不支持' 在一个div消息,并使用JavaScript来隐藏div时页面加载

+1

此解决方案的问题是,即使启用javascript,也会显示消息直到整个页面加载。 – dreamer 2013-12-25 11:15:02

7

你是对的<noscript>标签仅用于在JavaScript禁用时显示。 为了测试这个,请执行下列操作:

  • 保存此片段在一个文件“的test.html”。
  • 用你的浏览器打开它。
  • 启用/禁用JavaScript(在FireFox中,这里是:Tools/Options/Content/Enable JS)。

正如你所看到的,你可以把任何HTML<noscript>标签,你会放一个页面的体内内。

<html> 
    <body> 
    <h1>Simple Example Page</h1> 
    <script type="text/javascript"> 
     document.write("Hi, JavaScript is enabled!"); 
    </script> 
    <noscript> 
     <div style="border: 1px solid purple; padding: 10px"> 
     <span style="color:red">JavaScript is not enabled!</span> 
     </div> 
    </noscript> 
    </body> 
</html> 
1

<noscript>是为这种事情,就像<script>是为JS。请注意,使用meta标记刷新:

<noscript> 
    <META HTTP-EQUIV="Refresh" CONTENT="0;URL=ShowErrorPage.html"> 
</noscript> 

表示,这是在IE浏览器(IE10至少)通过提高网络安全性选项(这是很可能用于禁止JS摆在首位),很容易被禁用。当安全设置增加时,“允许META REFRESH”选项被禁用。

5
<noscript> 
    <META HTTP-EQUIV="Refresh" CONTENT="0;URL=ShowErrorPage.html"> 
</noscript> 

不是一个好的解决方案,因为IE11(和以前的版本)有一个安全选项,当设置为'high'时禁用Javascript和Meta Refresh标签!

我已经找到了处理这种情况最好的解决办法是:

<noscript class="noscript"> 
    <div id="div100"> 
    Please enable javascript in your browser .... blah blah 
    </div> 
</noscript> 

<style> 
    body{ 
     position:relative; 
    } 
    .noscript { 
     width:100%; 
     height:100%; /* will cover the text displayed when javascript is enabled*/ 
     z-index:100000; /* higher than other z-index */ 
     position:absolute; 
    } 
    .noscript #div100{ 
     display:block; 
     height:100%; 
     background-color:white; 
    } 
</style> 
0

您可以使用计算器使用相同的方法。看到我的jsfiddle链接。当Javascript被禁用时,在第一个noscript块中,在body标签后面,你可以添加一个填充顶部到一个空的div div,这样你就可以在你的body中添加你想要的内容,最后,另一个带有固定位置div的noscript块,它有你想要的警告信息。尝试运行它,启用和不启用JavaScript。让我知道! :)

在这里看到的代码:https://jsfiddle.net/go60f00n/

<noscript> 
     <div id='noscript_padding'></div> 
     </noscript> 
     <div> 
     <p>Lorem ipsum dolor sit amet consectetuer tincidunt nunc ac faucibus mattis. Gravida tempus turpis Morbi vitae sed Suspendisse auctor dignissim nulla adipiscing. Adipiscing justo lacinia justo Vivamus Vestibulum amet ut Donec vitae aliquet. Orci tempus orci Donec nibh eget tellus pede semper adipiscing leo. A et id sagittis velit venenatis.</p> 
     <p>Tellus ridiculus ipsum pretium condimentum Ut elit sed vitae amet In. Curabitur ipsum elit interdum tortor semper at dolor justo consequat leo. Id fermentum vitae tincidunt pretium lacus leo Cras urna risus urna. Pretium Vestibulum et euismod nec pede et tincidunt condimentum laoreet vel. Dolor vestibulum laoreet habitant a Nulla.</p> 
     <p>Lobortis lobortis quis elit mollis quis risus Morbi in augue montes. Mauris ipsum libero tellus et Quisque id non justo nibh dui. Dui nisl at Fusce Curabitur interdum tincidunt sed Vestibulum platea justo. At ut ante eget ac sem sed nulla id nunc mus. Velit In faucibus a auctor Sed Morbi habitasse est urna natoque. </p> 
     </div> 
     <noscript> 
     <div id='noscript_warning'>Please enable Javascript!</div> 
     </noscript> 

所以CSS代码:

html, body { 
      margin: 0; 
      padding: 0; 
      height: 100%; 
     } 

     p { 
      margin: 0; 
     } 

     #noscript_padding { 
      padding-top: 1.9em; 
     } 

     #noscript_warning { 
      position: fixed; 
      top: 0; 
      left: 0; 
      width: 100%; 
      z-index: 101; 
      text-align: center; 
      font-weight: bold; 
      color: #FFF; 
      background-color: #AE0000; 
      padding: 5px 0 5px 0; 
     } 
相关问题