De façon valable pour ajouter noscript en tête pour l'emballage de redirection

Je pensais donc un moyen simple de traiter avec le javascript soit désactivé par le navigateur serait le suivant:

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

Et avoir la nojs.html avoir quelque chose comme:

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

À l'écrasement de la page.

Ce n'est pas ma méthode préférée, mais c'est agréable et simple jusqu'à ce que quelque chose de plus gracieux peut être travaillé pour les utilisateurs sans javascript.

Cependant, il n'est pas valable pour mettre un <noscript> élément dans le head section. Les tests préliminaires ont travaillé de toute façon, bien sûr, mais je suis superstitieux quand il s'agit de mon code est valide, plus j'avais de la haine pour ce à fait échouer un test de terrain.

Donc, il y a un moyen valable de le faire? Peut-être enveloppant les noscript dans un autre élément, comme une balise d'objet? Ou de certains plus simplement encore, je ne pense pas à?

  • HTML5 permet l'utilisation de <noscript> dans le head section.
InformationsquelleAutor Anthony | 2010-02-16
  1. 24

    Je ne suis pas sûr de savoir pourquoi vous avez besoin de rediriger vers une autre page au lieu de simplement afficher un message. J'utilise JS et un peu de CSS pour gérer ces situations et pour moi. Quelque chose comme ceci:

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

    Puis dans 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 */

    En le faisant de cette façon, la classe est appliquée à la html élément avant la page est affichée afin de ne pas obtenir un scintillement comme la non-JS contenu est échangé pour la JS contenu.

    • Pourquoi <div id="noscript"> et pas <noscript>? Vous pouvez prendre que le troisième ligne de votre feuille de style CSS.
    • Plus à assurer sa cohérence. Aussi, très peu d'éléments sont valables pour l'utilisation à l'intérieur <noscript> des balises, donc dans cet exemple, il serait une alternative idéale, mais dans de nombreux cas, il ne serait pas.
    InformationsquelleAutor Doug Neiner
  2. 6

    Doug solution est assez bon, mais il a quelques inconvénients:

    • Il n'est pas valide, d'avoir un attribut de classe sur l'élément html. Au lieu de cela, utiliser le corps.
    • Il exige que vous savez quel type d'affichage pour définir l'élément (c'est à dire ".js #wrapper { display: block }").

    Plus simple, plus valide et une solution flexible en utilisant la même approche pourrait être:

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

    Avec cela, il est valide html (aucun attribut de classe sur l'élément html). Il est plus simple (moins de CSS). Il est flexible. Il suffit d'ajouter le "jsOnly" classe à n'importe quel élément que vous souhaitez afficher uniquement quand JS est activé.

    • Approche qui, sans redirection (et leur contenu flash) et pris en charge dans le HTML4/5.
    InformationsquelleAutor Spycho
  3. 4

    La <noscript> étiquette ne peut pas être dans la <head>, il doit être dans le <body>

    La pratique courante est de montrer un message à la place de la redirection, comme il n'y a aucun moyen de rediriger uniquement si javascript est désactivé.

    Vous pourriez le faire dans l'autre sens, la première page nojs.html et sur cette page qui utilise javascript pour rediriger vers le contenu principal.

    • En HTML4.01 c'est vrai, mais pour HTML5, vous pouvez écrire <noscript> dans <head> (à l'aide de <lien>, <style> et <meta> éléments seulement) w3schools.com/tags/tag_noscript.asp
    InformationsquelleAutor Peter Di Cecco
  4. 0

    Si vous voulez vraiment un moyen valable de le faire, rendre votre page principale la nojs.htm page et l'utiliser JS pour cacher tout le contenu avant qu'il soit présenté à l'utilisateur et immédiatement rediriger vers la vraie page principale à l'aide de javascript.

    • Cela augmente le temps de chargement pour le cas normal, tout en améliorant légèrement l'expérience de la présence anormale de cas. Comme telle, elle n'est pas une bonne idée.
    InformationsquelleAutor Samuel Neff
  5. 0

    J'aime Doug solution. Toutefois, si vous avez besoin de rediriger, je voudrais rappeler que bien qu'il y est une spécification et un standard, le monde des navigateurs web est un sale, monde imparfait. Si oui ou non quelque chose est autorisé par la spécification n'est pas aussi important que de savoir si oui ou non cela fonctionne dans l'ensemble des navigateurs vous vous souciez.

    Il suffit de regarder le code source de tout site majeur... la Plupart d'entre eux ne validez pas je serais prêt à parier 🙂

    InformationsquelleAutor levik
  6. 0

    Ce sujet:

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

    Et:

    <noscript>
<p>Please <a href="no_js_instructions.php">enable Javascript</a> on your browser.</p></noscript>
    • La solution créative, mais il devrait être position: fixed; au lieu de position: absolute;.
    InformationsquelleAutor Giona