Schaltflächen in Webseiten werden verwendet, um eine interaktive Benutzererfahrung bereitzustellen. Wenn für die Reaktion auf einen Button-Klick kein Senden von Daten an den Server erforderlich ist, wird die Interaktion in der Regel über JavaScript-Skripte realisiert. Die Methoden zum Aufrufen des entsprechenden JavaScript-Codes können variieren. Nachfolgend finden Sie einige mögliche Optionen für Schaltflächen unterschiedlichen Typs.
Anleitung
Schritt 1
Wenn die Anzeige einer Schaltfläche in einer Webseite über das Button-Tag organisiert wird, kann der JavaScript-Code im onclick-Attribut platziert werden. Zum Beispiel so: button Natürlich ist es nicht ratsam, ausreichend großen Code direkt in das Button-Tag einzufügen - es ist besser, es als Funktion zu entwerfen und nur den Code zum Aufruf dieser Funktion in das onclick-Attribut zu legen. Beispielsweise:
Funktion showAlert () {
Alert ('Button angeklickt!')
}
Taste
Schritt 2
Wenn die Schaltfläche über eine der Eingabe-Tag-Variationen (Senden, Zurücksetzen, Schaltfläche oder Bild) angezeigt wird, kann dasselbe onclick-Attribut verwendet werden. Für eine Schaltfläche zum Löschen von Formularfeldern (Zurücksetzen) könnte der Code beispielsweise so aussehen: Wenn Sie möchten, dass beim Klicken auf die Schaltfläche nur JavaScript ausgeführt wird und die Standardaktion nicht ausgeführt wird, fügen Sie den Befehl return zum Befehl -Funktion oder direkt auf das onclick-Attribut false. Beispielsweise:
Schritt 3
Wenn Sie eine Reaktion auf das Klicken auf eine Schaltfläche vom Typ "Senden" organisieren müssen, können Sie zusätzlich zu der obigen Methode mit dem onclick-Attribut die Eigenschaften des Formular-Tags verwenden, zu dem diese Schaltfläche gehört. Der entsprechende Funktionsaufruf kann im onsubmit-Attribut des form-Tags platziert werden. Beispielsweise:
Schritt 4
Handelt es sich bei der Schaltfläche nicht um ein Formularelement, sondern lediglich um ein grafisches Element (img-Tag), so erlauben die Standards dafür auch die Verwendung des onclick-Attributs. Beispielsweise:
Schritt 5
Handelt es sich bei der Schaltfläche um einen Hyperlink, sollten Sie nicht die Attribute der Schaltfläche selbst verwenden, sondern die Eigenschaften des Link-Tags verwenden. Sie können, wie in den vorherigen Optionen, das onclick-Tag verwenden. Zum Beispiel: Und Sie können die Adresse im href-Attribut durch einen Funktionsaufruf ersetzen. Zum Beispiel so:
