Verwenden Sie das Label-Tag, um das Optionsfeld auszuwählen, indem Sie auf den Text klicken

Das <label>-Tag definiert eine Bezeichnung (Tag) für ein Eingabeelement. Das Beschriftungselement bietet für den Benutzer keine besondere Wirkung. Allerdings verbessert es die Benutzerfreundlichkeit für Mausbenutzer. Dieses Steuerelement wird ausgelöst, wenn Sie auf den Text im Beschriftungselement klicken. Das heißt, wenn der Benutzer das Tag auswählt, verschiebt der Browser den Fokus automatisch auf das mit dem Tag verknüpfte Formularsteuerelement. Das for-Attribut des <label>-Tags sollte mit dem id-Attribut des zugehörigen Elements identisch sein.

Beispiel 1:

Code kopieren

Der Code lautet wie folgt:

<label für="Mann">
<input type="radio" value="Radio" name="man" id="man"/>
männlich
</Bezeichnung>
<label für="man2">
<input type="radio" value="Mann" name="man" id="man2"/>
weiblich
</Bezeichnung>

Beispiel 2:

Code kopieren

Der Code lautet wie folgt:

<input type="checkbox" name="Pages" value="Job" id="Job" ><label for="Job">Jobinformationen hinzufügen und bearbeiten</label>

<input type="checkbox" name="Pages" value="JobQuery" id="JobQuery" ><label for="JobQuery">Rekrutierungsinformationen abfragen und löschen</label>

<input type="checkbox" name="Seiten" value="Technologie" id="Technologie" aktiviert><label for="Technologie">Technologieelemente hinzufügen oder ändern</label>

<<: 6 Vererbungsmethoden von JS Advanced ES6

>>: Richtige Methode zum Schreiben leerer Links, um Seitensprünge nach dem Klicken auf ein href #-Problem zu verhindern

Mysql5.7 my.ini-Dateiladepfad und Datenspeicherortänderungsmethode unter Windows 7

Lösung für das Problem, dass der Text unten links steht und bei der Gestaltung des Textbereichs nicht in der Größe geändert werden kann

Zwei kleine Probleme, die mich aber lange Zeit ges...

Verwenden Sie das Label-Tag, um das Optionsfeld auszuwählen, indem Sie auf den Text klicken

Mysql5.7 my.ini-Dateiladepfad und Datenspeicherortänderungsmethode unter Windows 7

Grundsätze zur Auswahl von MySQL-Datentypen

Zusammenfassung grundlegender SQL-Anweisungen in der MySQL-Datenbank

Einführung in JavaScript-Array-Deduplizierungs- und -Flatteningfunktionen

So implementieren Sie die Seiten-Screenshot-Funktion in JS

So aktivieren oder deaktivieren Sie SSH für einen bestimmten Benutzer oder eine bestimmte Benutzergruppe in Linux

Linux verwendet lsof/extundelete-Tools, um versehentlich gelöschte Dateien oder Verzeichnisse wiederherzustellen

Einführung in berechnete Eigenschaften in Vue

Einführung in die Verwendung von Ankern (benannte Anker) in HTML-Webseiten

OpenLayers realisiert die Methode zur aggregierten Anzeige von Punkt-Feature-Layern

Artikel empfehlen

Tutorial zur Konfiguration der kostenlosen MySQL-Installationsversion

Gründe und Methoden zum Warten auf die Sperre der Tabellenmetadaten in MySQL

Detaillierte Analyse des MySQL-Datentyps DECIMAL

Lösung für das Problem, dass der Text unten links steht und bei der Gestaltung des Textbereichs nicht in der Größe geändert werden kann

Der Effekt eines dynamischen CSS-Farbverlaufsrahmens, der um den Inhaltsbereich rotiert (Beispielcode)

Implementierung des Wasserfall-Layouts im Uni-App-Projekt

Analyse der Anweisungsausführungsreihenfolge von SQL und MySQL

Detaillierte Erläuterung der MySQL-Deadlock-Prüfung und Beispiele zur Deadlock-Entfernung

Win10 Installation Linux System Tutorial Diagramm

Detaillierte Erläuterung des Vuex-Gesamtfalls

MySQL-Optimierung: Cache-Optimierung

Beispiel für den Mehrpunkt-Routenplanungsprozess des WeChat-Applets Amap – detaillierte Erläuterung

Zwei Möglichkeiten zur Installation des Linux-Subsystems in Windows 10 (mit Bildern und Text)

Verwendung des SerialPort-Moduls in Node.js

Benutzerdefinierte Docker-Netzwerkimplementierung