HTML5, Inmatningselement - Del 2

Innehållsförteckning
Redan i den första delen av denna handledning definierade vi de attribut som vi kan arbeta med, vi såg att vi har några nya för HTML5 och andra som inte är det, men när det gäller att bygga fasta fält som hjälper oss i de väsentliga processerna på webbplatsen, är det när kombinationen av dessa och korrekt användning av var och en kommer att hjälpa oss att samla in bästa möjliga data.
Ange storleken på ett fält
Som vi har sett har vi två attribut som direkt påverkar storleken på ett fält, dessa är storlek Y Maxlängd, en reglerar fältets visuella amplitud och den andra mängden text som fältet faktiskt kan ta emot.
Låt oss se ett exempel med båda attributen:
 Exempel

Jams:

Stad:

Frukt:

Skicka in röst

I det här exemplet ser vi hur det första fältet anges a MaxlängdEndast med detta berättar vi för webbläsaren att den bara kan ta emot 10 tecken, men den kan tilldela standardbredden, i det andra fältet anger vi storlek Med vad vi säger till det hur brett det ska vara, men vi begränsar inte textinmatningen och i det tredje tillämpar vi båda villkoren, låt oss se hur det fungerar i webbläsaren.

Användning av värde och platshållare
Efter att ha sett skillnaden mellan dessa två fält, i det här exemplet kommer vi att effektivt demonstrera hur man applicerar dem på ett formulär, låt oss se hur vi använder dem i följande kod.
 Exempel

Jams:

Stad:

Frukt:

Skicka in röst

Som vi kan se i de två första fälten indikerar platshållaren en hjälp för vad användaren måste ange, det här värdet som platshållaren innehåller är inte värdet på inmatningsfältet, så om vi skickar in dessa fält kommer de tomma, istället kommer tredje fält Det har något som redan är placerat i värdeattributet, detta om det skulle skickas när det skickas till nämnda formulär.
Låt oss se hur webbläsaren skulle visa oss detta

Skapa skrivskyddade fält
Ibland måste vi arbeta med skrivskyddade fält, antingen för att värdet inte ska ändras av användaren eller att det bara är informativt. Det kan också vara så att det är resultatet av en tidigare filtrering av användaren och endast detta värde kan ses, för detta har vi två alternativ som även om de verkar likadana är helt olika.
Vi hade redan sett attributet läsbart och vi vet att det är så att fältet inte kan ändras, vi har också attributet Inaktiverad, har samma funktion som läsbart, dock när du gör Skicka in alla områden Inaktiverad de lämnas inte in så det är som om det inte finns i formuläret.
Låt oss se ovanstående förklarat med ett praktiskt exempel.
 Exempel

Jams:

Stad:

Frukt:

Skicka in röst

Vi kan se att det första fältet är inaktiverat och det andra i readonly, när funktionshindrade visas i webbläsaren visas det med en grå färg, vanligtvis associerad med att inte aktivera, medan readonly ses som ett normalt fält, även om vi försöker för att skriva till någon, låter ingen oss skriva text.
Låt oss se hur exemplet är:

Med detta avslutar vi den andra delen av handledningen, vi kan nu förbättra våra formulär med hjälp av grundläggande valideringar av storlek och mängd text och även kontrollera vad användaren kan ändra eller inte, förutom att vi kan visa hjälp i fälten så att han har en idé om att du ska eller inte ska gå in.Gillade du och hjälpte denna handledning?Du kan belöna författaren genom att trycka på den här knappen för att ge honom en positiv poäng

Du kommer att bidra till utvecklingen av webbplatsen, dela sidan med dina vänner

wave wave wave wave wave