HTML-formulär är ett av de mest grundläggande sätten att lägga till interaktivitet på din webbplats. Du kan ställa frågor och söka svar från dina läsare, ge ytterligare information från databaser, skapa spel och annat. Det finns ett antal HTML-element som du kan använda för att bygga dina formulär. Och när du har byggt upp din form finns det många olika sätt att skicka in den informationen till servern eller bara starta formuläråtgärden som körs.
Det här är flera sätt du kan skicka in dina formulär:
-
- Det här är den vanligaste metoden för att få data till servern, men det kan vara väldigt vanligt.
-
- Att använda en bild gör det mycket enkelt att göra din inlämningsknapp passande med stilen på din webbplats. Men vissa människor kanske inte känner igen det som en inlämningsknapp.
-
- Knappen
INMATNING taggen ger många av samma alternativ som bilden
INMATNING tagg, men ser mer ut som standard inlämningstyp. Det kräver JavaScript för att aktivera.
- Knappen
-
- De
KNAPP taggen är en mer mångsidig typ av knapp än
INMATNING märka. Den här taggen kräver att Javacript aktiveras.
- De
- De
KOMMANDO Elementet är nytt i HTML5, och det ger ett sätt att aktivera skript och formulär med tillhörande åtgärder. Den aktiveras med JavaScript.
- De
INPUT Element
Inmatningen
INMATNING element är det vanligaste sättet att skicka in en blankett, allt du gör är att välja en typ (
knapp,
bild, eller
lämna) och vid behov lägga till några skript för att skicka in till formuläråtgärden.
De element kan skrivas just så. Men om du gör det kommer du att ha olika resultat i olika webbläsare. De flesta webbläsare gör en knapp som säger "Skicka", men Firefox gör en knapp som säger "Submit Query." För att ändra vad knappen säger ska du lägga till ett attribut:
värde = "Skicka formulär">
Elementet är skrivet så, men om du lämnar bort alla andra attribut är allt som visas i webbläsare en tom grå knapp. För att lägga till text på knappen, använd
värdeattribut. Men den här knappen skickar inte formuläret om du inte använder JavaScript.
onclick = "skicka ();">
Det liknar
knapptyp, vilket behöver ett manus för att skicka in formuläret. Förutom att istället för ett textvärde behöver du lägga till en bildkälla-URL.
Knappelementet
De
KNAPPElementet kräver både en öppningsmärke och en stängningskod. När du använder det, kommer innehåll som du bifogar inuti taggen att bifogas på en knapp. Då aktiverar du knappen med ett skript.
Skicka formulär
Du kan inkludera bilder i din knapp eller kombinera bilder och text för att skapa en mer intressant knapp.
Kommandonelementet
De
KOMMANDOElementet är nytt med HTML5. Det kräver inte en
FORM att användas, men det kan fungera som en inlämningsknapp för en blankett. Med det här elementet kan du skapa fler interaktiva sidor utan att behöva formulär om du inte behöver formulär. Om du vill att kommandot ska säga något skriver du informationen i en
märkaattribut.
label = "Submit Form">
Om du vill att ditt kommando ska representeras av en bild, använder du
ikonattribut.
icon = "submit.gif">
HTML-formulär har flera olika sätt att skicka in, som du har lärt dig på föregående sida. Två av dessa metoder är
INMATNINGtaggen och
KNAPPmärka. Det finns goda skäl att använda båda dessa element.
Ingångselementet
Taggen är det enklaste sättet att skicka in ett formulär. Det kräver inget annat än taggen själv, inte ens en
värdeNär en kund klickar på knappen, skickas den automatiskt. Du behöver inte lägga till några skript, webbläsare vet att skicka formuläret när en inlämning skickas
INMATNINGtaggen klickas.
Problemet är att den här knappen är mycket ful och vanlig. Du kan inte lägga till bilder på den. Du kan stile det precis som något annat element, men det kan fortfarande känna sig som en grym knapp.
Använd
INMATNINGmetod när din blankett måste vara tillgänglig även i webbläsare som har JavaScript avstängt.
KNAPP Element
De
KNAPPElementet erbjuder fler alternativ för att skicka in formulär. Du kan sätta något inuti a
KNAPPelement och vänd det till en inlämningsknapp. Vanligtvis använder människor bilder och text. Men du kan skapa en
DIV och gör den hela saken en inlämningsknapp om du ville.
Den största nackdelen med
KNAPPelementet är att det inte automatiskt skickar formuläret. Det betyder att det måste finnas någon typ av skript för att aktivera det. Och så är det mindre tillgängligt än
INMATNINGmetod. Alla användare som inte har JavaScript aktiverat kan inte skicka in en blankett med endast en
KNAPPelement för att skicka in den.
Använd
KNAPPMetod på former som inte är lika kritiska. Det här är också ett bra sätt att lägga till ytterligare inlämningsalternativ inom en form.
