Aktive Verbindungen sie den Klassennamen nicht angezeigt hinzugefügt, wenn die Seite aktualisiert wird oder wenn der gleiche Link von einer anderen Seite

Script angeklickt:Aktive Verbindungen sie den Klassennamen nicht angezeigt hinzugefügt, wenn die Seite aktualisiert wird oder wenn der gleiche Link von einer anderen Seite

$(".classname li a").each(function() { 
    var hreflink = $(this).attr("href"); 
    if (hreflink == location.href) { 
     $(this).addClass("active"); 
    } else { 
     $(this).removeClass("active"); 
    } 
});

CSS:

.classname li a.active{color:#ef9223;}

Jedes Mal, wenn ich ein Seitenaktualisierung, wenn sich derselbe Link auf einer anderen Seite befindet, wird die aktive Klasse nicht mehr auf diesen Link angewendet.

Actual exmple Ich habe folgende Navigation Links ABCDEFGH .... Z. Und die gleiche Navigation ist auf der Hauptseite (Header-Bereich) .. so, wenn ich auf einem Link klicken .. es muss aktiv sein wenn ich zu einer ABCD E..oder Z Seite komme. Und selbst bei einer Seitenaktualisierung muss die aktive Verknüpfung beibehalten werden. Hoffnung, die erklärt ... und hilft :)

Jede Hilfe, Eingaben, Lösung würde sehr geschätzt werden.

Quelle

2012-04-11 Vinay

Was Sie/do/hier versuchen, so scheint es sehr merkwürdig und gewunden. – Josh

Ich habe deine Frage zweimal gelesen und bin mir immer noch nicht sicher, was du meinst. Können Sie bitte Ihre Frage bearbeiten und sich besser erklären? –

Tatsächlich habe ich die folgenden Navigations-Links ABCDEFGH .... Z. Und die gleiche Navigation ist auf der Hauptseite (Header-Bereich) .. also wenn ich auf einen Link klicke .. muss es aktiv sein, wenn ich ankomme zu irgendwelchen ABCD E..oder Z Seiten. Und selbst bei einer Seitenaktualisierung muss die aktive Verknüpfung beibehalten werden. Hoffe, das erklärt ... und hilft:) v – Vinay

Innerhalb Ihrer Schleife, Diese ist eigentlich das Anker-Tag nicht das Tag, das die Klasse 'Klassenname' hat. Ihr css sollte sein:

.active {color:#ef9223;}

Sie brauchen auch nicht die Klasse entfernen, wenn dieser Code beim Laden der Seite ausgeführt wird.

Sehen Sie sich diese jsFiddle für ein Beispiel - http://jsfiddle.net/XWLWL/7/

Quelle

2012-04-11 18:18:48 tjscience

'.classname li a.active {color: # ef9223;}' funktioniert genauso gut. Aber Sie haben Recht, den Klassennamen zu entfernen: Es ist unnötig. –

ich stimme zu..das ist wie es derzeit ist .. aber auf Seite aktualisieren .. der aktive Link geht weg .. – Vinay

Tatsächlich habe ich die folgenden Navigationslinks ABCDEFGH .... Z. Und die gleiche Navigation ist auf der Hauptseite (Header-Abschnitt) .. Wenn ich auf einen Link klicke, muss er aktiv sein, wenn ich zu einer beliebigen ABCD E..oder Z-Seite komme. Und selbst bei einer Seitenaktualisierung muss die aktive Verknüpfung beibehalten werden. Hoffe das erklärt ... und hilft :) – Vinay

Eine Klasse oder irgendetwas, das Sie mit JavaScript hinzufügen, bleibt bei der Seitenaktualisierung nicht erhalten. So funktioniert es.

JavaScript ändert nur Ihre lokal geladenen HTML-Elemente und -Strukturen. Sobald Sie die Seite aktualisieren oder zu einer anderen Seite wechseln, wird der gesamte Status durch das Laden der eingehenden Seite gelöscht. Der Server hat keine Kenntnis von irgendetwas, was Sie auf dieser Seite getan haben. Es wird eine neue Seite mit dem Standardstatus gesendet, und dann wird JavaScript ausgeführt. Dieses Skript kennt auch keine vorherigen Seitenladevorgänge oder Skriptausführung.

Wenn Sie möchten, dass der Status beim Laden der Seite beibehalten wird, müssen Sie dies auf der Serverseite tun. Dazu müssen AJAX-Aufrufe an den Server gesendet werden, damit er weiß, welche Links "aktiv" sein sollen wäre verantwortlich für das Hinzufügen dieser Klasse beim nachfolgenden Laden der Seite.

Quelle

2012-04-11 18:07:45

oh .. nicht bewusst, dass es so kompliziert sein .. – Vinay

Aktive Verbindungen sie den Klassennamen nicht angezeigt hinzugefügt, wenn die Seite aktualisiert wird oder wenn der gleiche Link von einer anderen Seite

Antwort

Verwandte Themen