Jak wykryć, czy JavaScript jest wyłączony?


659

Dziś rano był post z pytaniem, ile osób wyłącza JavaScript. Potem zacząłem się zastanawiać, jakich technik można użyć do ustalenia, czy użytkownik ją wyłączył.

Czy ktoś zna jakieś krótkie / proste sposoby wykrycia, czy JavaScript jest wyłączony? Moim zamiarem jest ostrzeżenie, że strona nie może poprawnie działać bez włączonej przeglądarki JS.

W końcu chciałbym przekierować je do treści, które są w stanie działać przy braku JS, ale potrzebuję tego wykrycia jako elementu zastępczego, aby rozpocząć.


Co chcesz zrobić z tymi informacjami? Może to zmienić otrzymaną odpowiedź - np. Ogólnie należy preferować stopniowe ulepszanie, zamiast próbować wykryć wyłączenie JavaScript i podejmować określone działania w oparciu o to.
Jonny Buchanan,

szukam stopniowego ulepszania. Chcę, aby nie był w stanie przekierować ich do alternatywnych treści, które będą działały poprawnie w absurcji włączonej lub zdolnej przeglądarki JS.
MikeJ

1
@expiredninja Ten post od Nicholasa Zakasa mówi o 2%, choć ma ponad rok.
sdleihssirhc

Najłatwiejszym sposobem jest użycie noscript do wyświetlenia strony innej niż javascript i użycie javascript do wyświetlenia elementów zależnych od javascript poprzez modyfikację wyświetlania stylu.
Myforwik,

Odpowiedzi:


286

Zakładam, że próbujesz zdecydować, czy dostarczać treści z ulepszoną obsługą JavaScript. Najlepsze implementacje degradują się czysto, dzięki czemu strona nadal działa bez JavaScript. Zakładam również, że masz na myśli wykrywanie po stronie serwera , zamiast używania <noscript>elementu z niewyjaśnionego powodu.

Nie ma dobrego sposobu na wykrycie JavaScript po stronie serwera. Alternatywnie możliwe jest ustawienie pliku cookie za pomocą JavaScript , a następnie testowanie tego pliku cookie za pomocą skryptów po stronie serwera przy kolejnych odsłonach. Nie byłoby to jednak odpowiednie do podjęcia decyzji o treści, która ma zostać dostarczona, ponieważ nie byłby w stanie odróżnić odwiedzających bez plików cookie od nowych użytkowników lub odwiedzających, którzy blokują pliki cookie.


129
<noscript> JEST najbardziej semantycznie dokładnym sposobem określania treści nienależącej do javascript - a raczej wykrywanie, czy javascript jest wyłączony, wykrywanie, czy jest włączone. Pokaż więc domyślnie komunikat „potrzebujesz javascript, aby poprawnie korzystać z mojej witryny”, ale ukryj go za pomocą funkcji javascript natychmiast po załadowaniu.
matt lohkamp,

58
@matt lohkamp: Lub nawet domyślnie ukryj wiadomość i umieść w niej <style>blok, <noscript>aby go odkryć (nie ma tam przepływu, jeśli JS jest włączony). Co zaskakujące, działa to we wszystkich nowoczesnych przeglądarkach, a nawet w IE6
Piskvor opuścił budynek

7
@matt - Robiłem to przez pewien czas, ale wiadomość pozostaje przez pewien czas na wolnych połączeniach, pozostawiając użytkowników zdezorientowanych. Szukam tutaj innego rozwiązania. @Piskvor - znacznik <noscript> w nagłówku nie będzie sprawdzany, a znacznik <style> w treści nie będzie sprawdzany.
Ben,

20
... oprócz tego, dlaczego obawiasz się walidacji? Czy sprawdzasz tylko, czy chcesz sprawdzić? To może nie być „poprawne”, ale jeśli to działa i osiąga to „z odrobiną brudu pod maską”, jaki jest problem? Nie martw się, nie osądzę ;-)
keif

4
Pozostaje ważny, jeśli po prostu użyjesz atrybutu style do podanych elementów w tagach <noscript> (takich jak <noscript> <div style = "color: red;"> blahblah </div> </noscript> lub sg. Podobne) . ALE pozostaje również ważne, jeśli normalnie umieścisz <style> BLOCK w nagłówku określającym styl niektórych elementów klasy .noscript (lub podobnych), a w treści tagów <noscript> po prostu nadasz danym elementom poprzednio zdefiniowana klasa .noscript, jak poniżej: <noscript> <div class = "noscript"> blahblah </div> </noscript>
Sk8erPeter

360

Chciałbym tutaj dodać mój .02. Nie jest w 100% kuloodporny, ale myślę, że jest wystarczająco dobry.

Problem z moim preferowanym przykładem umieszczenia jakiegoś komunikatu „ta strona nie działa tak dobrze bez Javascript” polega na tym, że musisz upewnić się, że witryna działa poprawnie bez Javascript. A kiedy już zaczniesz tę drogę, zaczniesz zdawać sobie sprawę, że witryna powinna być kuloodporna z wyłączonym JS, a to cała spora część dodatkowej pracy.

Tak naprawdę to, czego naprawdę chcesz, to „przekierowanie” na stronę z napisem „włącz JS, głupie”. Ale oczywiście nie można niezawodnie przekierowywać meta. Oto sugestia:

<noscript>
    <style type="text/css">
        .pagecontainer {display:none;}
    </style>
    <div class="noscriptmsg">
    You don't have javascript enabled.  Good luck with that.
    </div>
</noscript>

... gdzie cała zawartość twojej witryny jest owinięta div klasy „pagecontainer”. CSS wewnątrz tagu noscript ukryje wówczas całą zawartość strony i wyświetli komunikat „brak JS”, ​​który chcesz wyświetlić. To właśnie wydaje się robić Gmail ... a jeśli jest wystarczająco dobry dla Google, jest wystarczająco dobry dla mojej małej witryny.


12
@steve kiedykolwiek próbował zweryfikować google.com? walidacja po prostu określa, jak blisko dokumentu następuje arkusz specyfikacji, w żaden sposób nie wpływa to na użyteczność strony.
JKirchartz

71
@JonasGeiregat Co jest złego w zmuszaniu użytkownika do wymagania Javascript, jeśli twoja aplikacja internetowa została zbudowana - i wymaga - Javascript do działania? Zbyt często słyszę ten komentarz, ale dotyczy on tylko najprostszych stron. Wypróbuj Facebook bez JS i zobacz, co się stanie. Jeśli twoja aplikacja została zbudowana dla Javascript, to co jest złego w wymaganiu, co 99% użytkowników i tak włączyło?
Lee Benson,

19
@Lee uderza go w gwóźdź, możesz zrobić tylko tyle dla użytkownika, zanim narysujesz linię na tym, co będziesz wspierać. Oczekujemy, że wszyscy użytkownicy będą mieli urządzenie z dostępem do Internetu. Czy powinienem również wdrożyć wersję papierową mojej witryny dla tych, którzy odmawiają dostępu do Internetu?
Kolors

14
@Kolors, skomentowałem to w marcu 2012 roku i twierdzę, że dzisiaj jest to podwójnie prawdziwe. Od tego czasu mamy Meteor, Angular.Js, Famo.us i mnóstwo niesamowitych bibliotek, które wymagają JavaScript do uruchomienia . Zastanawiam się, co użytkownicy, którzy zdecydowali się wyłączyć JS, faktycznie próbują osiągnąć ... najwyraźniej nie surfują po tej samej sieci, co reszta z nas, i nie ma powodu, dla którego firma powinna musieć zmniejszać swoją witrynę dla najmniejszych podzbiór upartych użytkowników ...
Lee Benson

6
Tak, i zastanawiałem się, dlaczego nie mogłem głosować za odpowiedzią, skoro zapomniałem aktywować JS :-)) Podoba mi się i wdrażam twoje rozwiązanie! Dzięki!
Garavani

198

noscript bloki są wykonywane, gdy JavaScript jest wyłączony, i są zwykle używane do wyświetlania treści alternatywnych do wygenerowanych w JavaScript, np

<script type="javascript">
    ... construction of ajaxy-link,  setting of "js-enabled" cookie flag, etc..
</script>
<noscript>
    <a href="next_page.php?nojs=1">Next Page</a>
</noscript>

Użytkownicy bez js otrzymają next_pagelink - możesz tutaj dodać parametry, abyś wiedział na następnej stronie, czy otrzymali link JS / non-JS, lub spróbuj ustawić plik cookie za pośrednictwem JS, którego brak sugeruje JS jest niepełnosprawny. Oba te przykłady są dość trywialne i otwarte na manipulacje, ale masz pomysł.

Jeśli chcesz mieć czysto statystyczny obraz tego, ilu użytkowników ma wyłączoną obsługę javascript, możesz zrobić coś takiego:

<noscript>
    <img src="no_js.gif" alt="Javascript not enabled" />
</noscript>

następnie sprawdź dzienniki dostępu, aby zobaczyć, ile razy ten obraz został trafiony. Nieco prymitywne rozwiązanie, ale da ci dobry pomysł w procentach dla twojej bazy użytkowników.

Powyższe podejście (śledzenie obrazu) nie działa dobrze w przeglądarkach tekstowych lub tych, które w ogóle nie obsługują js, więc jeśli twoja baza użytkowników przesuwa się głównie w tym obszarze, może to nie być najlepsze podejście.


7
To nie jest bardzo skuteczne. Na przykład nie będzie liczyć nikogo w przeglądarkach tekstowych, które normalnie nie obsługują JavaScript. Przynajmniej powinieneś wyłączyć buforowanie tego obrazu.
Jim

3
Czy przeglądarka, która w ogóle nie obsługuje JS, nie po prostu zignoruje tag noscript i wyświetli obraz?
LKM

1
@LKM: Zależy od tego, jak są napisane, najprawdopodobniej by tak zrobili, więc zrobiłbyś z tego kropkę 1x1px. Ta opcja służy głównie do śledzenia wzorców użytkowania po stronie serwera, więc nadal będzie dobrze, ponieważ jest uruchamiana przez użytkownika bez możliwości obsługi javascript.
ConroyP

Zauważ, że obecnie występuje błąd w IE8 i tagu noscript, jeśli go stylizujesz ... zobacz positioniseverything.net/explorer.html
alex

2
możesz także podać ten obraz jako skrypt po stronie serwera, ustawiając typ MIME i użyć go do zarejestrowania niektórych informacji o użytkowniku lub upuszczenia pliku cookie ... px.sklar.com/code.html/id=256
JKirchartz,

46

To działało dla mnie: przekierowuje użytkownika, jeśli javascript jest wyłączony

<noscript><meta http-equiv="refresh" content="0; url=whatyouwant.html" /></noscript>

6
To jest nieprawidłowe Elementy noscript nie mogą zawierać elementów meta. Nie ufałbym temu, aby działał niezawodnie we wszystkich przeglądarkach (w tym w przyszłych przeglądarkach, w których nie można obecnie testować), ponieważ mogą one odzyskiwać błędy na różne sposoby.
Quentin

15
Może to być nieprawidłowe, ale spójrz na kod Facebooka, używa tego samego rozwiązania w części <head> - co nie znaczy, że jest to bardzo dobre rozwiązanie, ponieważ kod Facebooka jest daleki od prawidłowego kodu, ALE może to oznaczać, że działa w przeglądarce wielu użytkowników, co może być ważnym aspektem. Ale to prawda, że ​​tak naprawdę nie jest to sugerowane. Oto ich kod: <noscript> <meta http-equiv = refresh content = "0; URL = / about / messages /? _ Fb_noscript = 1" /> </noscript>
Sk8erPeter

IE9 (przynajmniej) ma ustawienie „zezwalaj na META REFRESH”. Nie wydaje mi się, żeby wielu to wyłączało, ale prawdopodobnie robią to ci, którzy nie lubią javascript, ale jeśli chcesz 100%, to nie to.
jenson-button-event

Jest ważny w HTML5.
Naszta

1
To niszczy link podczas próby udostępnienia na Linkedin, znaleźliśmy ciężką drogę ... to nie jest dobry pomysł. Ponieważ linkin podąża za odświeżaniem meta, ignorując tagi Og itp.
SomeDudeSomewhere

44

Jeśli Twoim przypadkiem użycia jest formularz (np. Formularz logowania), a skrypt po stronie serwera musi wiedzieć, czy użytkownik ma włączoną obsługę JavaScript, możesz zrobić coś takiego:

<form onsubmit="this.js_enabled.value=1;return true;">
    <input type="hidden" name="js_enabled" value="0">
    <input type="submit" value="go">
</form>

Spowoduje to zmianę wartości js_enabled na 1 przed przesłaniem formularza. Jeśli skrypt po stronie serwera ma wartość 0, nie ma JS. Jeśli dostanie 1, JS!


44

Sugeruję, aby przejść na drugą stronę, pisząc dyskretny JavaScript.

Włącz funkcje projektu dla użytkowników z wyłączoną obsługą JavaScript, a kiedy skończysz, zaimplementuj ulepszenia interfejsu JavaScript.

https://en.wikipedia.org/wiki/Unobtrusive_JavaScript


145
Życie jest zbyt krótkie. Jest 2012- Włącz obsługę JavaScript lub idź do domu
Yarin

25
„Życie jest za krótkie. Jest rok 2012 - Włącz javascript lub idź do domu!” to idealna mała wiadomość do wyświetlenia w przypadku braku JS. zalogowałem się tylko po to, aby powiedzieć, że @Yarin

5
Właśnie się zalogowałem, aby powiedzieć, że jest NIESAMOWITE! @Yarin. Tworzę małą witrynę, która nie będzie ogólnie publiczna (rozważ jak intranet, ale dla przyjaciół zbierających się, aby pracować nad projektem). Robię to SPA i nie zawracam sobie głowy awarią. Dyskretny JavaScript prawie podwoi obciążenie, które wkładam w koncepcję SPA. Dzięki nowoczesnym bibliotekom javascript, takim jak między innymi Knockout, Jquery, musimy po prostu zaakceptować fakt, że nie każda witryna może być łatwo „dyskretna”. JavaScript to przyszłość sieci.
lassombra

5
@Yarin Tworzę aplikacje PHP / JS na życie, których nigdy nie wkładam w awarie ... jeśli to nie zadziała dla kogoś, kto się ze mną skontaktuje i mówię im, aby przestali żyć w przeszłości i włączyli JS.
Sam

2
@ n611x007 - Nieetyczne rzeczy kryją się w całym kodzie, na każdym urządzeniu, zarówno po stronie serwera, jak i klienta. To nie jest wina kodów, to wina ludzi. Uważam kampanię przeciwko JS ironic, ponieważ nadal używasz zewnętrznego dostawcy usług internetowych do łączenia się z Internetem, nadal używasz komputera z zewnętrznym sprzętem / oprogramowaniem układowym, nadal używasz niezabezpieczonych sieci komórkowych dostępnych dla osób wstrzykujących, wciąż posiadasz telefon komórkowy, który używa nieprzepisany system operacyjny innej firmy, nadal korzystaj z płaskiego telewizora, który korzysta z szeroko zakrojonej usługi aktualizacji firmy trzeciej itp. Zawsze jesteś ofiarą kanałów MITM niezależnie od tego, czy wyłączysz JS w przeglądarce.
dhaupin

35

<noscript>nie jest nawet konieczne i nie wspominając o nieobsługiwanym w XHTML .

Przykład roboczy :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<head>
    <title>My website</title>
    <style>
      #site {
          display: none;
      }
    </style>
    <script src="http://code.jquery.com/jquery-latest.min.js "></script>
    <script>
      $(document).ready(function() {
          $("#noJS").hide();
          $("#site").show();
      });
    </script>
</head>
<body>
    <div id="noJS">Please enable JavaScript...</div>
    <div id="site">JavaScript dependent content here...</div>
</body>
</html>

W tym przykładzie, jeśli JavaScript jest włączony, zobaczysz witrynę. Jeśli nie, pojawi się komunikat „Proszę włączyć JavaScript”. Najlepszym sposobem na sprawdzenie, czy JavaScript jest włączony, jest po prostu próba użycia JavaScript! Jeśli to działa, jest włączone, jeśli nie, to nie jest ...


1
Ha, XHTML. To były dni ... Wiele się zmieniło: developer.mozilla.org/en-US/docs/Web/HTML/Element/noscript
Stephan Weinhold

po co używać jquery ...
Luis Villavicencio

@StephanWeinhold, JSF używa XHTML.
Arash

34

Użyj klasy .no-js na ciele i utwórz style nie JavaScript w oparciu o klasę nadrzędną .no-js. Jeśli javascript jest wyłączony, otrzymasz wszystkie style inne niż javascript, jeśli jest wsparcie JS, klasa .no-js zostanie zastąpiona dając wszystkie style jak zwykle.

 document.body.className = document.body.className.replace("no-js","js");

sztuczka używana w szablonie HTML5 http://html5boilerplate.com/ poprzez modernizr, ale można użyć jednego wiersza javascript do zastąpienia klas

Tagi noscript są w porządku, ale po co mieć dodatkowe elementy w html, skoro można to zrobić za pomocą css


5
Nie mogę uwierzyć, że zajęło to tak długo, zanim ktoś wspomniał o .nojsklasie! To jedno z najbardziej płynnych podejść i noscriptwstyd.
Mojżesz

15

trochę trudne, ale (Hairbo podsunęło mi pomysł)

CSS:

.pagecontainer {
  display: none;
}

JS:

function load() {
  document.getElementById('noscriptmsg').style.display = "none";
  document.getElementById('load').style.display = "block";
  /* rest of js*/
}

HTML:

<body onload="load();">

  <div class="pagecontainer" id="load">
    Page loading....
  </div>
  <div id="noscriptmsg">
    You don't have javascript enabled. Good luck with that.
  </div>

</body>

w każdym razie działałoby, prawda? nawet jeśli tag noscript nie jest obsługiwany (wymagany jest tylko trochę css) ktoś zna rozwiązanie inne niż css?


13

Możesz użyć prostego fragmentu kodu JS, aby ustawić wartość ukrytego pola. Po odesłaniu wiesz, czy JS został włączony, czy nie.

Lub możesz spróbować otworzyć wyskakujące okno, które zamykasz szybko (ale może być widoczne).

Masz także tag NOSCRIPT, którego możesz używać do wyświetlania tekstu w przeglądarkach z wyłączonym JS.


To nie jest dobra odpowiedź. Pierwsze rozwiązanie wymaga ponownego załadowania strony i przesłania formularza. Drugie rozwiązanie otwiera wyskakujące okienko (potwierdzenie!) I zamyka je „szybko” - od strony klienta? -1
Ben,

Czasami musisz wiedzieć po stronie serwera, czy witryna ma włączoną obsługę JS, czy nie, więc nie widzę, jak możesz to zrobić inaczej niż wysyłanie czegoś z powrotem. Zgadzam się, że wyskakujące okienko jest brzydkie i nie jestem do końca tego pewien, ale powinno być możliwe otwarcie wyskakującego okienka poza widocznym obszarem ekranu, aby nie przeszkadzało to użytkownikowi. Brak elegancji, ale działa i nie ma konieczności ponownego ładowania strony.
rslite,

Spamboty również publikują posty na ukrytym polu.
Janis Veinbergs

13

Będziesz chciał spojrzeć na tag noscript.

<script type="text/javascript">
...some javascript script to insert data...
</script>
<noscript>
   <p>Access the <a href="http://someplace.com/data">data.</a></p>
</noscript>

12

Tag noscript działa dobrze, ale będzie wymagał każdego dodatkowego żądania strony, aby nadal wyświetlać bezużyteczne pliki JS, ponieważ zasadniczo noscript jest po stronie klienta sprawdzaniem.

Możesz ustawić plik cookie w JS, ale jak zauważył ktoś inny, może się to nie powieść. Najlepiej byłoby móc wykryć stronę klienta JS i bez używania plików cookie ustawić po stronie serwera sesji dla tego użytkownika, który wskazuje, że JS jest włączony.

Istnieje możliwość dynamicznego dodania obrazu 1x1 za pomocą JavaScript, gdzie atrybut src jest tak naprawdę skryptem po stronie serwera. Wszystko, co robi ten skrypt, zapisuje w bieżącej sesji użytkownika, że ​​JS jest włączony ($ _SESSION ['js_enabled']). Następnie możesz wysłać pusty obraz 1x1 z powrotem do przeglądarki. Skrypt nie uruchomi się dla użytkowników, którzy mają wyłączoną JS, a zatem $ _SESSION ['js_enabled'] nie zostanie ustawiony. Następnie w przypadku kolejnych stron udostępnianych temu użytkownikowi możesz zdecydować, czy chcesz uwzględnić wszystkie swoje zewnętrzne pliki JS, ale zawsze będziesz chciał uwzględnić to zaznaczenie, ponieważ niektórzy użytkownicy mogą korzystać z dodatku NoScript Firefox lub mieć JS tymczasowo wyłączone z innego powodu.

Prawdopodobnie będziesz chciał dołączyć to sprawdzenie gdzieś blisko końca strony, aby dodatkowe żądanie HTTP nie spowalniało renderowania strony.


12

Dodaj to do znacznika HEAD każdej strony.

<noscript>
        <meta http-equiv="refresh" runat="server" id="mtaJSCheck" content="0;logon.aspx" />
</noscript>

Więc masz:

<head>
    <noscript>
        <meta http-equiv="refresh" runat="server" id="mtaJSCheck" content="0;logon.aspx" />
    </noscript>
</head>

Z podziękowaniami dla Jaya.


12

Ponieważ zawsze chcę dać przeglądarce coś wartego uwagi, często używam tej sztuczki:

Po pierwsze, każda część strony, która wymaga JavaScript do poprawnego działania (w tym pasywne elementy HTML, które są modyfikowane za pomocą wywołań getElementById itp.) Są zaprojektowane tak, aby nadawały się do użytku w stanie takim, w jakim są, przy założeniu, że nie jest dostępny JavaScript. (zaprojektowany tak, jakby go nie było)

Wszelkie elementy wymagające JavaScript, umieszczam wewnątrz tagu coś takiego:

<span name="jsOnly" style="display: none;"></span>

Następnie na początku dokumentu używam .onloadlub document.readyw pętli, getElementsByName('jsOnly')aby ponownie .style.display = "";włączyć włączanie elementów zależnych od JS. W ten sposób przeglądarki inne niż JS nie muszą nigdy widzieć części witryny zależnych od JS, a jeśli je mają, pojawia się natychmiast, gdy będzie gotowe.

Kiedy już przyzwyczaisz się do tej metody, dość łatwo jest zhybrydyzować twój kod, aby poradzić sobie w obu sytuacjach, chociaż dopiero teraz eksperymentuję ze noscriptznacznikiem i oczekuję, że będzie on miał dodatkowe zalety.


10

Jest to „najczystsze” użycie identyfikatora rozwiązania:

<noscript>
    <style>
        body *{ /*hides all elements inside the body*/
            display: none;
        }
        h1{ /* even if this h1 is inside head tags it will be first hidden, so we have to display it again after all body elements are hidden*/
            display: block;
        }
    </style>
    <h1>JavaScript is not enabled, please check your browser settings.</h1>
</noscript>

9

Typowym rozwiązaniem jest metatag w połączeniu z noscript, aby odświeżyć stronę i powiadomić serwer, gdy JavaScript jest wyłączony, w następujący sposób:

<!DOCTYPE html>
<html lang="en">
    <head>
        <noscript>
            <meta http-equiv="refresh" content="0; /?javascript=false">
        </noscript>
        <meta charset="UTF-8"/>
        <title></title>
    </head>
</html>

W powyższym przykładzie, gdy JavaScript jest wyłączony, przeglądarka przekieruje na stronę główną witryny za 0 sekund. Ponadto wyśle ​​również parametr javascript = false na serwer.

Skrypt po stronie serwera, taki jak node.js lub PHP, może następnie przeanalizować parametr i dowiedzieć się, że JavaScript jest wyłączony. Następnie może wysłać do klienta specjalną wersję strony internetowej w języku innym niż JavaScript.


8

Jeśli javascript jest wyłączony, twój kod po stronie klienta i tak nie będzie działał, więc zakładam, że masz na myśli, że chcesz, aby te informacje były dostępne po stronie serwera. W takim przypadku noscript jest mniej pomocny. Zamiast tego chciałbym mieć ukryte dane wejściowe i użyć javascript do wypełnienia wartości. Jeśli wartość jest tam dostępna, po kolejnym żądaniu lub odesłaniu zwrotnym wiesz, że JavaScript jest włączony.

Uważaj na takie rzeczy jak noscript, gdzie pierwsze żądanie może pokazywać wyłączony javascript, ale przyszłe żądania włączają go.


5

Możesz na przykład użyć czegoś takiego jak document.location = 'java_page.html', aby przekierować przeglądarkę na nową stronę pełną skryptów. Brak przekierowania oznacza, że ​​JavaScript jest niedostępny, w takim przypadku możesz skorzystać z narzędzi CGI lub wstawić odpowiedni kod między znacznikami. (UWAGA: NOSCRIPT jest dostępny tylko w Netscape Navigator 3.0 i nowszych).

kredyt http://www.intranetjournal.com/faqs/jsfaq/how12.html


4

Techniką, której użyłem w przeszłości, jest użycie JavaScript do napisania pliku cookie sesji, który po prostu działa jak flaga informująca, że ​​JavaScript jest włączony. Następnie kod po stronie serwera szuka tego pliku cookie, a jeśli nie zostanie znaleziony, podejmuje odpowiednie działania. Oczywiście ta technika polega na włączeniu obsługi plików cookie!


4

Myślę, że możesz wstawić tag obrazu do tagu noscript i spojrzeć na statystyki, ile razy Twoja witryna i jak często ten obraz był ładowany.


4

Ludzie już opublikowali przykłady, które są dobrymi opcjami wykrywania, ale w oparciu o wymóg „ostrzeż, że witryna nie może działać poprawnie bez włączonej przeglądarki JS”. Zasadniczo dodajesz element, który pojawia się w jakiś sposób na stronie, na przykład „wyskakujące okienka” w przepełnieniu stosu, gdy zdobywasz znaczek, z odpowiednim komunikatem, a następnie usuwasz go za pomocą Javascript, który uruchamia się, gdy tylko strona zostanie załadowana ( i mam na myśli DOM, a nie całą stronę).


3

Wykryć to w czym? JavaScript? To byłoby niemożliwe. Jeśli chcesz go tylko do celów logowania, możesz użyć jakiegoś schematu śledzenia, w którym każda strona ma JavaScript, który zażąda specjalnego zasobu (prawdopodobnie bardzo małego giflub podobnego). W ten sposób możesz po prostu odróżnić unikalne żądania strony od żądań pliku śledzenia.


3

Dlaczego po prostu nie umieścisz przechwyconej procedury obsługi zdarzeń onClick (), która będzie uruchamiana tylko po włączeniu JS, i użyj tego, aby dołączyć parametr (js = true) do klikniętego / wybranego adresu URL (możesz również wykryć listę rozwijaną i zmień wartość dodania ukrytego pola formularza). Więc teraz, gdy serwer zobaczy ten parametr (js = true), wie, że JS jest włączony, a następnie wykonaj swoją fantazyjną logikę po stronie serwera.
Wadą tego jest to, że kiedy użytkownicy po raz pierwszy odwiedzają Twoją witrynę, zakładki, adresy URL, adresy URL generowane przez wyszukiwarki - musisz wykryć, że jest to nowy użytkownik, więc nie szukaj NVP dołączonej do adresu URL, i serwer będzie musiał poczekać do następnego kliknięcia, aby ustalić, czy użytkownik ma włączoną / wyłączoną obsługę JS. Kolejną wadą jest to, że adres URL skończy się na adresie URL przeglądarki, a jeśli ten użytkownik doda ten zakładki do zakładek, będzie miał js = true NVP, nawet jeśli użytkownik nie ma włączonej JS, chociaż przy następnym kliknięciu serwer bądź mądry, aby wiedzieć, czy użytkownik nadal ma włączoną obsługę JS, czy nie. Westchnienie ... to jest fajne ...


3

Aby zmusić użytkowników do włączenia skryptów JavaScript, ustawiam atrybut „href” każdego linku do tego samego dokumentu, co powiadamia użytkownika o włączeniu skryptów JavaScript lub pobraniu przeglądarki Firefox (jeśli nie wiedzą, jak włączyć JavaScript). Zapisałem rzeczywisty adres URL linku do atrybutu „nazwa” linków i zdefiniowałem globalne zdarzenie onclick, które odczytuje atrybut „nazwa” i przekierowuje tam stronę.

Działa to dobrze dla mojej bazy użytkowników, choć trochę faszystowskie;).


i trochę denerwujące, jeśli użytkownik ma włączoną obsługę JS i klika link, zanim rozpocznie się progresywny skrypt javascript ...
Simon_Weaver

1
Jasne, ale nie zgłoszono jeszcze problemu.
Jan Sahin

3

Nie wykrywasz, czy użytkownik ma wyłączoną obsługę javascript (po stronie serwera lub klienta). Zamiast tego zakładasz, że javascript jest wyłączony i budujesz swoją stronę z wyłączonym javascript. Eliminuje to potrzebę noscript, której i tak powinieneś unikać, ponieważ nie działa całkiem dobrze i jest niepotrzebny.

Na przykład po prostu zbuduj swoją witrynę, aby powiedzieć <div id="nojs">This website doesn't work without JS</div>

Następnie twój skrypt po prostu wykona document.getElementById('nojs').style.display = 'none';i zajmie się normalną działalnością JS.


jest to świetne bezproblemowe podejście Znaczniki <noscript> są znacznie trudniejsze do utrzymania na różnych stronach dzięki temu podejściu możesz zachować styl noscript poprzez plik css.
zadubz

3

Sprawdź pliki cookie za pomocą czystego rozwiązania po stronie serwera, które przedstawiłem tutaj, a następnie sprawdź javascript, upuszczając plik cookie za pomocą Jquery.Cookie, a następnie sprawdź w ten sposób, czy pliki cookie u Sprawdź zarówno pliki cookie, jak i javascript


3

W niektórych przypadkach zrobienie tego wstecz może być wystarczające. Dodaj klasę za pomocą javascript:

// Jquery
$('body').addClass('js-enabled');

/* CSS */
.menu-mobile {display:none;}
body.js-enabled .menu-mobile {display:block;}

Może to powodować problemy z konserwacją w każdym złożonym, ale dla niektórych rzeczy jest to prosta poprawka. Zamiast próbować wykryć, kiedy nie jest załadowany, po prostu określ styl zgodnie z momentem załadowania.


3

Chciałbym dodać moje rozwiązanie, aby uzyskać wiarygodne statystyki dotyczące liczby rzeczywistych użytkowników odwiedzających moją witrynę przy wyłączonym javascript w stosunku do wszystkich użytkowników. Kontrola jest przeprowadzana tylko raz na sesję z następującymi korzyściami:

  • Użytkownicy odwiedzający 100 stron lub tylko 1 liczą po 1. Pozwala to skupić się na pojedynczych użytkownikach, a nie na stronach.
  • W każdym razie nie przerywa przepływu, struktury ani semantycznej strony
  • Mógł logować agenta użytkownika. Pozwala to na wykluczenie botów ze statystyk, takich jak Google Bot i Bing Bot, które zwykle mają wyłączoną JS! Może również rejestrować adres IP, czas itp.
  • Tylko jeden czek na sesję (minimalne przeciążenie)

Mój kod używa PHP, mysql i jquery z ajax, ale można go dostosować do innych języków:

Utwórz tabelę w swojej bazie danych, taką jak ta:

CREATE TABLE IF NOT EXISTS `log_JS` (
  `logJS_id` int(11) NOT NULL AUTO_INCREMENT,
  `data_ins` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `session_id` varchar(50) NOT NULL,
  `JS_ON` tinyint(1) NOT NULL DEFAULT '0',
  `agent` varchar(255) DEFAULT NULL,
  PRIMARY KEY (`logJS_id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8;

Dodaj to do każdej strony po użyciu session_start () lub równoważnej (wymagana jquery):

<?  if (!isset($_SESSION["JSTest"]))
    { 
        mysql_query("INSERT INTO log_JS (session_id, agent) VALUES ('" . mysql_real_escape_string(session_id()) . "', '" . mysql_real_escape_string($_SERVER['HTTP_USER_AGENT']). "')"); 
        $_SESSION["JSTest"] = 1; // One time per session
        ?>
        <script type="text/javascript">
            $(document).ready(function() { $.get('JSOK.php'); });
        </script>
        <?
    }
?>

Utwórz stronę JSOK.php w następujący sposób:

<?
include_once("[DB connection file].php");   
mysql_query("UPDATE log_JS SET JS_ON = 1 WHERE session_id = '" . mysql_real_escape_string(session_id()) . "'");

3

Odkryłem inne podejście, używając samego css i javascript.
To tylko po to, by zacząć majstrować przy klasach i identyfikatorach.

Fragment CSS:
1. Utwórz regułę identyfikatora css i nazwij ją #jsDis.
2. Użyj właściwości „content”, aby wygenerować tekst po elemencie BODY. (Możesz to dowolnie stylizować).
3 Utwórz drugą regułę identyfikatora css, nazwij ją #jsEn i stylizuj. (dla uproszczenia nadałem mojej regule #jsEn inny kolor tła.

<style>
#jsDis:after {
    content:"Javascript is Disable. Please turn it ON!";
    font:bold 11px Verdana;
    color:#FF0000;
}

#jsEn {
    background-color:#dedede;
}

#jsEn:after {
    content:"Javascript is Enable. Well Done!";
    font:bold 11px Verdana;
    color:#333333;
}
</style>

Fragment kodu JavaScript:
1. Utwórz funkcję.
2. Chwyć identyfikator BODY za pomocą getElementById i przypisz go do zmiennej.
3. Za pomocą funkcji JS „setAttribute” zmień wartość atrybutu ID elementu BODY.

<script>
function jsOn() {
    var chgID = document.getElementById('jsDis');
    chgID.setAttribute('id', 'jsEn');
}
</script>

Część HTML.
1. Nazwij atrybut elementu BODY o identyfikatorze #jsDis.
2. Dodaj zdarzenie onLoad o nazwie funkcji. (jsOn ()).

<body id="jsDis" onLoad="jsOn()">

Ponieważ znacznik BODY otrzymał identyfikator #jsDis:
- Jeśli Javascript jest włączony , sam zmieni atrybut znacznika BODY.
- Jeśli Javascript jest wyłączony, wyświetli się tekst reguły css „content:”.

Możesz bawić się pojemnikiem #wrapper lub dowolnym DIV, który używa JS.

Mam nadzieję, że to pomoże uzyskać pomysł.


2

Dodanie odświeżenia w meta wewnątrz noscript nie jest dobrym pomysłem.

  1. Ponieważ tag noscript nie jest zgodny z XHTML

  2. Wartość atrybutu „Odśwież” jest niestandardowa i nie należy jej używać. „Odśwież” odbiera użytkownikowi kontrolę nad stroną. Użycie „Odśwież” spowoduje błąd w Wytycznych dotyczących dostępności treści internetowych W3C --- Dokumentacja http://www.w3schools.com/TAGS/att_meta_http_equiv.asp .


Nikt nic nie powiedział o XHTML. <noscript> jest całkowicie poprawnym ścisłym HTML 4.01.
Tom

2
noscript jest również doskonale poprawny w XHTML 1.0 i XHTML 1.1. Nie może zawierać meta elementów i należy go unikać na rzecz stopniowego ulepszania, ale jest to część języków.
Quentin
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.