Poprawny sposób dodawania noscript w nagłówku do owijania przekierowań

Więc myślałem, że prosty sposób radzenia sobie z wyłączaniem javascript przez przeglądarkę będzie następujący: 

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

I mając nojs.html mieć coś takiego: 

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

Na stronie crash.

To nie jest moja preferowana metoda, ale jest miła i prosta, dopóki nie można opracować czegoś bardziej wdzięcznego dla użytkowników bez javascript.

Nie jest jednak poprawne umieszczanie elementu <noscript> w sekcji head. Wstępne testy i tak zadziałały, z oczywiście, ale jestem przesądny, jeśli chodzi o ważność mojego kodu, plus nie chciałbym, aby to oblało test terenowy.

Czy jest na to jakiś ważny sposób? Może zawijanie noscript w inny element, np. znacznik object? Albo jakiś prostszy sposób, o którym nie myślę?
Author: Anthony, 2010-02-16
Source

6 answers

Nie jestem pewien, dlaczego musisz przekierowywać na inną stronę, zamiast po prostu pokazywać wiadomość. Używam JS i trochę CSS do obsługi tych sytuacji dla mnie. Coś takiego: 

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

Następnie w 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 */

Robiąc to w ten sposób, klasa jest stosowana do elementu html przed strona jest renderowana, więc nie dostaniesz migotania, ponieważ zawartość nie-JS jest zamieniana na zawartość JS.

 24
Author: Doug Neiner,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-16 03:48:42

Rozwiązanie Douga jest całkiem dobre, ale ma kilka wad:

  • nie jest poprawne posiadanie atrybutu class w elemencie html. Zamiast tego użyj ciała.
  • wymaga, abyś wiedział na jaki typ wyświetlacza ustawić element (np.".js #wrapper { display: block }").

Prostszym, bardziej poprawnym i elastycznym rozwiązaniem przy użyciu tego samego podejścia może być: 

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

Z tym jest poprawny html (brak atrybutu klasy w elemencie html). Jest to prostsze (mniej CSS). Jest elastyczny. Wystarczy dodać Klasa "jsOnly" do dowolnego elementu, który chcesz wyświetlać tylko wtedy, gdy JS jest włączony.

 6
Author: Spycho,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-08-08 15:15:04

Znacznik <noscript> nie może być w <head>, musi być w <body>

Powszechną praktyką jest wyświetlanie wiadomości zamiast przekierowywania, ponieważ nie ma możliwości przekierowania tylko wtedy, gdy javascript jest wyłączony.

Możesz to zrobić na odwrót, niech pierwsza strona będzie nojs.html, a na tej stronie użyj javascript, aby przekierować do głównej treści.
 4
Author: Peter Di Cecco,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-16 03:51:18

Jeśli naprawdę chcesz poprawny sposób, aby to zrobić, zrobić stronę główną nojs.htm strona i użyj JS, aby ukryć całą zawartość, zanim zostanie wyświetlona użytkownikowi i natychmiast przekierować do prawdziwej strony głównej za pomocą javascript.

 0
Author: Samuel Neff,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-16 03:46:30

Podoba mi się rozwiązanie Douga. Jeśli jednak trzeba przekierować, pamiętałbym, że choć istnieje spec i standard, świat przeglądarek internetowych jest brudnym, niedoskonałym światem. To, czy coś jest dozwolone przez specyfikację, nie jest tak ważne, jak to, czy działa w zestawie przeglądarek, na których Ci zależy.

Wystarczy spojrzeć na kod źródłowy każdej większej witryny... Większość z nich się nie zgodzi, założę się:)

 0
Author: levik,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-16 05:25:12

A co z: 

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

I: 

<noscript>
<p>Please <a href="no_js_instructions.php">enable Javascript</a> on your browser.</p></noscript>
 0
Author: Giona,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-10-14 07:40:14