Wie erkennt man, ob JavaScript deaktiviert ist?

Question

Es gab heute Morgen einen Beitrag, in dem gefragt wurde, wie viele Leute JavaScript deaktivieren. Dann fragte ich mich, welche Techniken verwendet werden könnten, um festzustellen, ob der Benutzer es deaktiviert hat.

Weiß jemand von einigen kurzen/einfachen Möglichkeiten, um festzustellen, ob JavaScript deaktiviert ist? Meine Absicht ist es, eine Warnung zu geben, dass die Website ohne aktiviertes JS nicht ordnungsgemäß funktionieren kann.

Letztendlich würde ich sie gerne zu Inhalten umleiten, die auch ohne JS funktionieren, aber ich benötige diese Erkennung als Platzhalter, um anzufangen.

Answer 1

Eine Technik, die ich in der Vergangenheit verwendet habe, ist die Verwendung von JavaScript, um ein Sitzungscookie zu schreiben, das einfach als Flagge dient, um anzuzeigen, dass JavaScript aktiviert ist. Dann sucht der serverseitige Code nach diesem Cookie und trifft bei Nichtvorhandensein entsprechende Maßnahmen. Natürlich beruht diese Technik darauf, dass Cookies aktiviert sind!

Answer 2

Ich denke, du könntest ein Bild-Tag in ein Noscript-Tag einfügen und die Statistiken darüber ansehen, wie oft deine Seite besucht wurde und wie oft dieses Bild geladen wurde.

Answer 3

Ich möchte meine Lösung hinzufügen, um zuverlässige Statistiken darüber zu erhalten, wie viele echte Benutzer meine Seite mit deaktiviertem Javascript im Vergleich zu allen Benutzern besuchen. Die Überprüfung erfolgt nur einmal pro Sitzung mit diesen Vorteilen:

• Benutzer, die 100 Seiten oder nur 1 Seite besuchen, werden jeweils als 1 gezählt. Dies ermöglicht es, sich auf einzelne Benutzer zu konzentrieren, nicht auf Seiten.
• Verändert nicht den Seitenfluss, die Struktur oder Semantik in irgendeiner Weise
• Könnte Benutzer-Agenten protokollieren. Dies ermöglicht es, Bots von den Statistiken auszuschließen, wie z.B. den Google-Bot und den Bing-Bot, die normalerweise JS deaktiviert haben! Könnte auch IP, Zeit usw. protokollieren...
• Nur eine Überprüfung pro Sitzung (minimale Überlastung)

Mein Code verwendet PHP, MySQL und jQuery mit Ajax, könnte aber an andere Sprachen angepasst werden:

Erstellen Sie eine Tabelle in Ihrer DB wie diese:

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;

Fügen Sie dies zu jeder Seite hinzu, nachdem Sie session_start() oder das Äquivalent verwendet haben (jQuery erforderlich):

            $(document).ready(function() { $.get('JSOK.php'); });

Erstellen Sie die Seite JSOK.php so:

Answer 4

Ich habe einen anderen Ansatz herausgefunden, indem ich CSS und JavaScript selbst verwende.
Dies dient lediglich dazu, mit Klassen und IDs herumzuspielen.

Der CSS-Schnipsel:
1. Erstellen einer CSS-ID-Regel und sie #jsDis nennen.
2. Verwenden Sie die Eigenschaft "content", um einen Text nach dem BODY-Element zu generieren. (Sie können dies nach Belieben gestalten).
3. Erstellen einer 2. CSS-ID-Regel und nennen Sie sie #jsEn und geben Sie ihr einen eigenen Stil. (Einfachheitshalber habe ich meiner #jsEn-Regel eine andere Hintergrundfarbe gegeben).

#jsDis:after {
    content:"Javascript ist deaktiviert. Bitte aktivieren Sie es!";
    font:bold 11px Verdana;
    color:#FF0000;
}

#jsEn {
    Hintergrundfarbe:#dedede;
}

#jsEn:after {
    content:"JavaScript ist aktiviert. Gut gemacht!";
    font:bold 11px Verdana;
    color:#333333;
}

Der JavaScript-Schnipsel:
1. Erstellen Sie eine Funktion.
2. Greifen Sie auf die BODY-ID mit getElementById zu und weisen Sie sie einer Variablen zu.
3. Ändern Sie mit der JS-Funktion 'setAttribute' den Wert des ID-Attributs des BODY-Elements.

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

Der HTML-Teil.
1. Benennen Sie das BODY-Elementattribut mit der ID #jsDis.
2. Fügen Sie das onLoad-Ereignis mit dem Funktionsnamen hinzu. (jsOn()).

Weil dem BODY-Tag die ID #jsDis gegeben wurde:
- Wenn JavaScript aktiviert ist, ändert es automatisch das Attribut des BODY-Tags.
- Wenn JavaScript deaktiviert ist, zeigt es den CSS-'content:'-Text.

Sie können mit einem #wrapper-Behälter herumspielen oder mit jedem DIV, das JS verwendet.

Hoffentlich trägt dies dazu bei, die Idee zu verstehen.

Answer 5

In einigen Fällen könnte es ausreichen, es rückwärts zu machen. Fügen Sie eine Klasse mit Javascript hinzu:

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

/* CSS */
.menu-mobil {display:none;}
body.js-aktiviert .menu-mobil {display:block;}

Das könnte bei komplexeren Dingen Wartungsprobleme verursachen, aber es ist eine einfache Lösung für einige Dinge. Anstatt zu versuchen zu erkennen, wann es nicht geladen ist, gestalten Sie einfach entsprechend, wenn es geladen ist.