Detaillierte Erklärung des Unterschieds zwischen einem href=# und einem href=javascript:void(0)
|
a href="#"> Nach dem Klicken auf den Link wird die Seite nach oben gescrollt. # Der Standardankerpunkt ist #TOP <a href="javascript:void(0)" onClick="window.open()"> Nach dem Anklicken des Links bewegt sich die Seite nicht, es wird lediglich der Link geöffnet <a href="#" onclick="javascript:return false;"> Gleicher Effekt wie oben, bei verschiedenen Browsern kann es Unterschiede geben. Wenn Sie nicht möchten, dass die Seite nach dem Anklicken eines Links nach oben scrollt, verwenden Sie href="javascript:void(0)" statt href="#". return false hat einen ähnlichen Effekt. Detaillierte Erklärung des Unterschieds zwischen href="#" und href="javascript:void(0)" "#" enthält eine Standortinformation. Der Standardanker ist #top, also der obere Rand der Webseite. JavaScript:void(0) zeigt nur einen toten Link an. Deshalb ist die Seite manchmal sehr lang und der Browser-Link ist eindeutig #, springt aber an den oberen Rand der Seite. JavaScript:void(0) ist nicht so. Daher ist es am besten, void(0) beim Aufrufen von Skripten zu verwenden. oder <input onclick> <div onclick> usw. Mehrere Möglichkeiten zum Öffnen von Links in neuen Fenstern 1.Fenster.öffnen('URL') 2. Benutzerdefinierte Funktionen verwenden Code kopieren Der Code lautet wie folgt:<Skript> Funktion openWin(Tag, Objekt) { obj.target="_blank"; obj.href = "Web/Umspannwerk/Umspannwerk.aspx?stationno="+tag; obj.klick(); } </Skript> <a href="javascript:void(0)" onclick="openWin(3,this)">LINK_TEST</a> window.location.href="" ------------------------------------------------------------------------------------------- Wenn es ein # ist, springt es nach oben. Hier sind einige Lösungen, die ich gesammelt habe: 1: <a href="####"></a> 2: <a href="javascript:void(0)"></a> 3: <a href="javascript:void(null)"></a> 4: <a href="#" onclick="return false"></a> 5: <span style="cursor:hand"></span> (scheint in FF nicht angezeigt zu werden) ------------------------------------------------------------------------------------------- Verwenden Sie JavaScript mit Vorsicht: void(0) Als ich heute CGI debuggte, wurde das CGI-Programm eindeutig ausgeführt und das Endergebnis war korrekt, aber die Seite wurde einfach nicht aktualisiert. Beim Test unter FireFox2.0 ist das Ergebnis normal, aber IE6 wird einfach nicht aktualisiert! Nach sorgfältiger Untersuchung habe ich festgestellt, dass der CGI-Seitenlink <a href="javaScript:void(0)" OnClick="XXX_Func();" ….> nur ein Beispiel </a> ist und das Problem in diesem void(0) liegt! Schauen wir uns zunächst die Bedeutung von void(0) in JavaScript an: In JavaScript ist void ein Operator, der angibt, dass ein Ausdruck ausgewertet werden soll, aber kein Wert zurückgegeben wird. Das Verwendungsformat des Void-Operators ist wie folgt: 1. javascript:void (Ausdruck_r_r) 2. javascript:void expression_r_r expression_r_r ist ein auszuwertender JavaScript-Standardausdruck. Die Klammern um den Ausdruck sind optional, es empfiehlt sich jedoch, sie einzuschließen. Wir können Hyperlinks mit dem Void-Operator angeben. Der Ausdruck wird ausgewertet, aber es wird nichts in das aktuelle Dokument geladen. Der folgende Code erstellt einen Hyperlink, der nichts tut, wenn der Benutzer darauf klickt. Wenn der Benutzer auf den Link klickt, wird void(0) als 0 ausgewertet, hat aber keine Auswirkung auf das JavaScript. <a href="javascript:void(0)">Hier klicken bewirkt nichts</a> Das heißt, wenn Sie einige Verarbeitungen durchführen möchten, aber nicht die gesamte Seite aktualisieren möchten, können Sie void(0) verwenden. Wenn Sie die Seite jedoch aktualisieren müssen, müssen Sie vorsichtig sein. Tatsächlich können wir <a href="javascript:void(document.form.submit())"> so verwenden, dieser Satz führt eine Übermittlungsoperation aus. In welchen Situationen wird void(0) also häufiger verwendet? Kein Refresh? Natürlich ist es Ajax. Wenn Sie sich Ajax-Webseiten ansehen, werden Sie im Allgemeinen viel void(0) sehen :), also sollten Sie vor der Verwendung von void(0) am besten darüber nachdenken, ob die Seite als Ganzes aktualisiert werden muss. Wenn wir JavaScript verwenden, benutzen wir normalerweise etwas wie: <a href="#" onclick="javascript:method">Senden</a> Die Methode ruft die JavaScript-Methode über einen Pseudolink auf. Ein Problem mit dieser Methode ist: Obwohl die Seite beim Klicken auf den Link nicht springt, wird die Bildlaufleiste nach oben scrollen. Die Lösung besteht darin, ein „False“ zurückzugeben. Wie unten dargestellt: <a href="#" onclick="javascript:method;return false;">Senden</a> Sie können auch ### verwenden. a href="javascript:void(0)" onclick="javascript:method;return false;"Senden javascript:void(0) springt nicht hoch :) Eine andere Methode ist #diese ein href="#this" onclick="javascript:method" |
>>: So erstellen Sie mit Photoshop ein Web-Drahtgittermodell
Artikel empfehlen
Beispiel für die Verwendung von JSX zum Erstellen einer Komponentenparserentwicklung
Inhaltsverzeichnis Aufbau einer JSX-Umgebung Einr...
Weitere beliebte und kreative Beispiele für Webdesign mit dunklem Hintergrund
Seitendesigns im dunklen Hintergrundstil sind seh...
So erstellen Sie ein einfaches Säulendiagramm mit Flex-Layout in CSS
Das Folgende ist ein Balkendiagramm im Flex-Layou...
Vue verwendet OSS zum Hochladen von Bildern oder Anhängen
Verwenden Sie OSS, um Bilder oder Anhänge in ein ...
So verwenden Sie den Yum-Befehl
1. Einführung in yum Yum (vollständiger Name Yell...
Beispiel für HTML-Abschirmung des Rechtsklickmenüs und der Linksklick-Eingabefunktion
Rechtsklickmenü deaktivieren <body oncontextme...
So stellen Sie eine Verbindung zu einem Remoteserver her und übertragen Dateien über einen Jump-Server in Linux
Vor kurzem traten bei der Bereitstellung der Umge...
Das Erlebnis gestalten: Was auf dem Knopf liegt
<br />Vor Kurzem hat UCDChina eine Artikelse...
Tutorial zur MySQL-Installation in der Linux-CentOS7-Umgebung
Detaillierte Einführung in die Schritte zur Insta...
So entfernen Sie den gepunkteten Rahmen beim Klicken auf einen Link in FireFox
Ich bin heute auf mehrere Browserkompatibilitätsp...
Detaillierte Erläuterung der Js-Klassenkonstruktion und Vererbungsfälle
Die Definition und Vererbung von Klassen in JS si...
Installations-Tutorial zur dekomprimierten Version von MySQL5.7.21 unter Win10
Installieren Sie die entpackte Version von Mysql ...
So implementieren Sie die Verschlüsselung und Entschlüsselung vertraulicher Daten in einer MySQL-Datenbank
Inhaltsverzeichnis 1. Vorbereitung 2. MySQL-Versc...
So installieren Sie Docker auf Ubuntu20.04 LTS
Null: Alte Version deinstallieren Ältere Versione...