Sådan validere en dato ved hjælp af JavaScript

February 23

Sådan validere en dato ved hjælp af JavaScript


Hvis du har en webside med en formular element i det og ønsker at validere brugeren dato input, kan du gøre det ved hjælp af JavaScript. Der er masser af tilgange til bruger input validering, herunder almindelige udtryk til komplekse dataelementer. Men for at validere en dato mod din ønskede format er ikke nødvendigvis kompleks. Du bliver nødt til at beslutte, hvilken dato format du vil acceptere og fodre disse oplysninger i din JavaScript-kode. Hvis brugerne indtaster ugyldige opdateret information, kan du bede dem om at fastsætte deres indtastede data før du sender den.

Instruktioner

Create a JavaScript function. 1 Opret en JavaScript-funktion. I webside med din HTML-formular i det, tilføjer en JavaScript-funktion til et script sektion på din side hoved. Hvis du ikke har et script sektion allerede, tilføj en som følger mellem åbning og lukning hovedet tags: <script type = "text / javascript"> </ script> Tilføj funktionen skitse inde i dette afsnit: funktion validateDate () {} du kan kalde funktionen, hvor du ønsker valideringen finder sted, såsom i "onclick" attribut på en knap i form: <input type = "knappen" value = "validere" onclick = "alert (validateDate ()? »gyldig«: »ugyldig«) "/> i dette tilfælde at klikke på knappen vil forårsage et output alarm indeholder" gyldig "eller" ugyldig ", men du kan ændre dette til dine behov.

Attempt to split the date into sections. 2 Forsøg at splitte datoen i sektioner. Inde din funktion, hente det indtastede tidspunkt. Følgende kode ville arbejde for en tekstfeltet med "date_in" som sit ID-attribut:. Var dateIn = document.getElementById ( "date_in") værdi; Hvad du medtage næste afhænger af, hvad format du ønsker, at dato for at have. Hvis du har angivet, at du vil "dd / mm / åååå" format, for eksempel "24/11/1980" forsøg på at splitte den indgang på skråstreg: Var dateSections = dateIn.split ( "/"); Nu kan du tjekke, om der er tre sektioner for dag, måned og år: if (! DateSections.length = 3) return false; I dette tilfælde vil koden returnerer en falsk værdi, hvis datoen ikke har tre sektioner adskilt af skråstreg, i hvilket tilfælde der ikke er behov for at holde kontrol som den dato er ugyldig.

Check whether each section is the correct length. 3 Kontroller, om hvert afsnit er den korrekte længde. Hvis scriptet fortsætter udfører efter linjen kontrol for tre sektioner, skal den dato hidtil være gyldig. Nu kontrollere, at hvert afsnit har den korrekte længde: var dage = dateSections [0]; if (day.length = 2!) return false; Dette returnerer false hvis den dag sektion er ikke to tegn. Gør det samme for den måned og år: var måneder = dateSections [1]; if (month.length = 2!) return false; Var år = dateSections [2]; if (year.length = 4!) return false; år Afsnittet kontrolleres for fire tegn.

Check whether the input sections are numeric. 4 Kontroller, om input sektioner er numerisk. Tilføj en check for at se, om hvert afsnit af input dato er et tal: if (isNaN (dag)) return false; Dette vil returnere falsk, hvis den dag sektion er ikke numerisk. Gør det samme igen for måned og år afsnit: if (isNaN (måned)) return false; if (isNaN (år)) return false; På dette tidspunkt funktionen vil kun fortsætte, hvis der er tre sektioner, hver med en række repræsenterede ved hjælp af to tegn for dag og måned, med fire tegn for året.

Check whether each section is in the correct range. 5 Kontroller, om hver sektion er i det korrekte område. Parsing tallene som heltal sikrer, at JavaScript vil behandle dem som tal: var dayNum = parseInt (dag); var monthNum = parseInt (måned); var yearNum = parseInt (år); Generelt vil det maksimale dag nummer være 31: var dayMax = 31; Men det varierer for visse måneder. Sæt det i måneder med 30 dage: hvis (monthNum == 4 || monthNum == 6 || monthNum == 9 || monthNum == 11) dayMax = 30; Sæt den for februar, generelt 28 dage med undtagelse af gyldige skudår: else if (monthNum == 2) {dayMax = 28; if ((yearNum% 4 == 0) && (((yearNum% 100 == 0)) || (yearNum% 400 == 0))!) dayMax = 29; } Kontroller, at dagen er gyldigt: if (dayNum <1 || dayNum> dayMax) return false; Gør det samme for måneden: if (monthNum <1 || monthNum> 12) return false; For året, kan du vælge hvad datointerval du overveje acceptabel, hvilket vil afhænge af formålet med din formular. Følgende test, om datoen er mellem 1900 og 2050: if (yearNum <1900 || yearNum> 2050) return false; Ved slutningen af ​​din funktion, returnere sandt, da scriptet kun vil nå dette punkt, hvis der ikke er fundet ugyldige data: returnere sandt;


relaterede artikler