22

クライアント側で JavaScript が無効になっている場合にメッセージにフラグを付けたい。ここで検索したところ、<noscript>このような処理に使用するタグが見つかりました。

これを w3schools エディターで確認しましたが、機能していません<noscript>。

ここに画像の説明を入力

4

6 に答える 6

47

これを試して ：-

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 には「meta refresh」という名前のメタ タグがあり、そのヘッダーで指定された間隔でユーザーを別のページにリダイレクトします。

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

上記のコードが noscript 内にあることがわかるように、間隔が「0」秒の「meta refresh」タグがあります。そのページでは JavaScript が無効になっているため、ブラウザは「ShowErrorPage.html」にリダイレクトされ、警告メッセージが表示されます。

これがお役に立てば幸いです。

于 2013-03-05T09:08:06.290 に答える
9

あなたは正しいです。この<noscript>タグは、JavaScript が無効になっている場合にのみ表示するために使用されます。これをテストするには、次の手順を実行します。

  • このスニペットをファイル「test.html」に保存します。
  • ブラウザで開いてください。
  • JavaScript を有効/無効にします (FireFox では、ツール/オプション/コンテンツ/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>
于 2013-03-05T09:19:00.210 に答える
7 
<noscript>
   <META HTTP-EQUIV="Refresh" CONTENT="0;URL=ShowErrorPage.html">
</noscript>

IE11 (およびそれ以前) には、「高」に設定すると Javascript とメタ リフレッシュ タグの両方が無効になるセキュリティ オプションがあるため、これは適切なソリューションではありません。

このケースを処理するために私が見つけた最良の解決策は次のとおりです。

<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>
于 2015-05-22T19:42:06.510 に答える
3

<noscript><script>JSの場合と同様に、この種のことを目的としています。メタ タグの更新を使用することに注意してください。

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

これは、Internet Options Security (おそらく最初に JS を無効にするために使用された) を増やすことで、IE (少なくとも IE10) で簡単に無効にできることを意味します。セキュリティ設定を高くすると、「メタリフレッシュを許可する」オプションが無効になります。

于 2015-02-09T09:26:41.267 に答える
1

「サポートしていません」というメッセージを div に配置し、ページの読み込み時に JavaScript を使用して div を非表示にします

于 2013-03-05T08:45:45.973 に答える
0

stackoverflow で使用されるのと同じ方法を使用できます。私のjsfiddleリンクを参照してください。Javascript が無効になっている場合、最初の noscript ブロック内の body タグの直後に、空の子 div に padding-top を追加して、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;
         }
于 2016-09-19T17:54:28.857 に答える