Gültig Weg hinzufügen noscript in Kopf zum Einwickeln Redirect

StackOverflow https://stackoverflow.com/questions/2270478

Frage

So war ich eine einfache Art und Weise zu denken mit Javascript zu behandeln durch den Browser deaktiviert wird, wäre die folgende: 

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

Und mit dem nojs.html hat so etwas wie: 

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

An dem Absturz Seite.

Das ist nicht meine bevorzugte Methode, aber es ist schön und einfach bis etwas anmutiger kann für Benutzer ohne Javascript ausgearbeitet werden.

Es ist jedoch nicht gültig ein <noscript> Element im head Abschnitt zu setzen. Die Vorversuche arbeitete trotzdem, natürlich, aber ich bin abergläubisch, wenn es um meinen Code gültig kommt, und ich würde dafür hassen, um tatsächlich einen Feldversuch fehlschlagen.

So ist es eine gültige Art und Weise, dies zu tun? Vielleicht Einwickeln der noscript in einem anderen Element, wie ein Objekt-Tag? Oder eine noch einfachere Art und Weise bin ich nicht zu denken?

War es hilfreich?

Lösung

Ich bin nicht sicher, warum Sie auf eine andere Seite umgeleitet werden müssen, anstatt nur eine Meldung angezeigt. Ich benutze JS und ein wenig CSS diese Situationen für mich zu handhaben. So etwas wie folgt aus: 

<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>

Dann in 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 */

Durch die es auf diese Weise tun, wird die Klasse auf das html Element angelegt vor die Seite gerendert wird, so werden Sie kein Flimmern erhalten, wie die Nicht-JS Inhalte getauscht wird aus der JS Inhalt .

Andere Tipps

Doug Lösung ist ziemlich gut, aber es hat einige Nachteile:

  • Es ist nicht gültig, ein Klasse-Attribut für das HTML-Element zu haben. Stattdessen den Körper verwenden.
  • Es setzt voraus, dass Sie wissen, was Darstellungsart um das Element (das heißt „.js #wrapper { display: block }“) zu setzen.

Eine einfache, gültige und flexible Lösung mit dem gleichen Ansatz könnte sein: 

<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>

Damit es gültige HTML (kein Klassenattribut auf dem HTML-Elemente). Es ist einfacher (weniger CSS). Es ist flexibel. Fügen Sie einfach die „jsOnly“ Klasse auf ein beliebiges Element, dass Sie nur die Anzeige wünschen, wenn JS aktiviert ist.

Der <noscript>-Tag nicht in der <head> sein kann, ist es in der <body> sein muss,

Die gängige Praxis ist, eine Nachricht statt Umleiten zu zeigen, da es keine Möglichkeit gibt, nur umgeleitet werden, wenn Javascript deaktiviert ist.

Sie könnte es anders tun um, haben die erste Seite nojs.html sein und auf dieser Seite zu verwenden JavaScript, um den Hauptinhalt zu umleiten.

Wenn Sie wirklich eine gültige Art und Weise wollen es zu tun, Ihre Haupt-Seite der nojs.htm Seite machen und JS verwenden, um alle Inhalte zu verstecken, bevor sie den Benutzer angezeigt sind und unmittelbar auf das reale Hauptseite mit Hilfe von Javascript umleiten.

ich wie Dougs Lösung. Wenn Sie jedoch umleiten müssen, würde ich erinnere mich, dass es zwar eine Spezifikation und ein Standard ist, ist die Welt des Web-Browser eine schmutzige, unvollkommene Welt. Unabhängig davon, ob etwas von der Spezifikation erlaubt ist, ist nicht so wichtig wie, ob es in der Gruppe von Browsern die Sie interessieren.

Just Blick auf den Quellcode von großen Website ... Die meisten von ihnen werden nicht bestätigen Ich tippe:)

Was ist mit: 

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

Und: 

<noscript>
<p>Please <a href="no_js_instructions.php">enable Javascript</a> on your browser.</p></noscript>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top