Wie kann der Browser am besten auf einen Link zurückgreifen, wenn JavaScript deaktiviert oder deaktiviert ist?

Question

Ich möchte einige Ajax-Sortieroptionen zu einer Liste hinzufügen. Da meine Seite bisher ohne JavaScript läuft, möchte ich sie für Leute mit deaktivierten alten/mobilen Browsern oder noscript laufen lassen.

Wie kann ich einen JavaScript-Block ausführen, wenn auf einen Link geklickt wird, wenn JavaScript aktiviert ist und dieser Link den Browser auf eine neue Seite verweist, wenn dies nicht der Fall ist. Ich würde mich gerne von Hacky-Noscript-Tags fernhalten.

Answer 1

Ihre Links müssen gültige Werte href auf die alternativen Nicht-JavaScript-Seiten zeigen und in Ihrem Klick-Ereignisse, müssen Sie false zurück, die Links JavaScript-fähige Browser zu vermeiden folgen:

<a id="aboutLink" href="about-us.html">About Us</a> 

---

$('#aboutLink').click(function() { 
    // ajax content retrieval here... 
    return false; // stop the link action... 
}); 

Answer 2

Ich könnte mir vorstellen, dass Sie die URL der neuen Seite in HREF einfügen und false vom onClick-Ereignishandler zurückgeben können, damit die Verknüpfung nicht mehr ausgeführt wird. Wenn JS nicht aktiviert ist, wird onClick nicht ausgeführt, was bedeutet, dass HREF verfolgt wird.

Answer 3

Für eine gute Trennung von Bedenken, ist Ihre beste Wette, attachEvent (IE) oder addEventListener (Standard) (oder ein Toolkit, dass Sie vor, wie Prototype, jQuery, MooTools, YUI, Glow, etc. versteckt) und dann das Ereignis innerhalb von JavaScript abbrechen. Unter der Annahme, diesen Link:

<a href='foo' id='mylink'>Link text</a> 

... hier ist ein Beispiel unter Verwendung von Prototype:

// Hook up your handler on page load 
document.observe("dom:loaded", function() { 
    // Look up the link, apply your handler 
    $('mylink').observe('click', yourHandler); 
}); 

// Your handler: 
function yourHandler(event) { 
    // Prevent the default action 
    event.stop(); 

    // ...your code here... 
} 

Sie haben den Link auf eine ID nicht zuweisen, gibt es viele Möglichkeiten gibt, andere DOM-Elemente zu finden, als IDs, aber es ist ein praktisches Beispiel.

jQuery, et. al., werden ihre eigenen Versionen von event.stop() haben, aber es kommt darauf an, das Ereignis abzubrechen.

Answer 4

ich preventDefault verwenden würde:

$('a').click(function(e) { 
    e.preventDefault(); //stop the browser from following 
    $('#someDiv').load('content.php'); 
}); 

<a href="no-script.html">Load content</a> 

Wenn es kein Javascript ist, wird die HREF folgen.

Answer 5

Ich würde einfach den HTML schreiben, wie es ohne JavaScript aussehen würde, und dann den Inhalt so ändern, wie es mit aktiviertem JavaScript aussehen sollte.

Wenn JS aktiviert ist, wird die Site möglicherweise ein wenig langsamer geladen und kann beim Erstellen etwas komisch aussehen, aber die Funktionalität bleibt erhalten. Wenn JS deaktiviert ist, bleibt die Seite so wie sie ist und bleibt für Nicht-JS-Benutzer zugänglich.