Maak aanpasbare tekstknoppen in HTML de... gebruiken invoer label. De invoer element wordt gebruikt binnen a het formulier element.
Door het instellen van de attribuuttype om te "knopen", genereert een eenvoudige klikbare knop. U kunt de tekst definiëren die op de knop zal verschijnen, zoals "Verzenden", met behulp van de waarde attribuut. Bijvoorbeeld:
De invoer tag zal geen HTML-formulier indienen; je moet opnemen JavaScript om de indiening van formuliergegevens af te handelen. Zonder JavaScript bij klikken evenement, lijkt de knop klikbaar, maar er gebeurt niets en u zult uw lezers gefrustreerd hebben.
Het 'knop' Tag-alternatief
Hoewel het gebruik van de invoer tag om een knop te maken werkt voor zijn doel, het is een betere optie om de knop tag om HTML-knoppen voor uw website te maken. De knop tag is flexibeler omdat u hiermee afbeeldingen voor de knop kunt gebruiken (waardoor u de visuele consistentie behoudt als uw site heeft bijvoorbeeld een ontwerpthema), en het kan worden gedefinieerd als een knop van het type Verzenden of resetten zonder dat er iets extra's nodig is JavaScript.
Specificeer de knop type attribuut in elk knop labels. Er zijn drie verschillende soorten:
- knop:De knop heeft geen inherent gedrag, maar wordt gebruikt in combinatie met scripts die aan de clientzijde worden uitgevoerd en die aan de knop kunnen worden gekoppeld en worden uitgevoerd wanneer erop wordt geklikt.
- resetten: Reset alle waarden.
- indienen: De knop verzendt formuliergegevens naar de server (dit is de standaardwaarde als er geen type is gedefinieerd).
Andere kenmerken zijn onder meer:
- naam: Geeft de knop een referentienaam.
- waarde: Specificeert een waarde die in eerste instantie aan de knop moet worden toegewezen.
- uitschakelen: Schakelt de knop uit.
Verder gaan met knoppen
HTML5 voegt extra attributen toe aan de knop tag die de functionaliteit ervan uitbreidt.
- autofocus: Wanneer de pagina wordt geladen, geeft deze optie aan dat deze knop de focus is. Er kan slechts één autofocus op een pagina worden gebruikt.
- het formulier: Koppelt de knop aan een specifiek formulier binnen hetzelfde HTML-document, waarbij de identifier van het formulier als waarde wordt gebruikt.
- vorming: Alleen gebruikt met typ = "verzenden" en een URL als waarde, specificeert het waar formuliergegevens naartoe worden gestuurd. Vaak is de bestemming een PHP-script of iets dergelijks,
- vormtype: Alleen gebruikt met typ = "verzenden" attribuut. Definieert hoe formuliergegevens moeten worden gecodeerd wanneer ze naar de server worden verzonden. De drie waarden zijn: application/x-www-form-urlencoded (standaard), meerdelige/formuliergegevens, en tekst/gewoon.
- vormmethode: Alleen gebruikt met typ = "verzenden" attribuut. Dit specificeert welke HTTP-methode moet worden gebruikt bij het indienen van formuliergegevens, ofwel: krijgen of post.
- formulier niet valideren: Alleen gebruikt met typ = "verzenden" attribuut. Formuliergegevens worden niet gevalideerd wanneer ze worden ingediend.
- vormdoel: Alleen gebruikt met typ = "verzenden" attribuut. Dit geeft aan waar de sitereactie moet worden weergegeven wanneer formuliergegevens worden ingediend, zoals in een nieuw venster, enz. De waarde-opties zijn ofwel_blank, _zelf, _ouder, _top, of een specifieke framenaam.
Lees meer over knoppen maken in HTML-formulieren, en hoe u uw site gebruiksvriendelijker kunt maken.