*   >> läser Utbildning artiklar >> tech >> web design

Validera Datum Genom Jquery

I den här artikeln kommer vi att lära sig att validera en dag genom jQuery. Det vill säga användaren måste ange datum i formatet mm /dd /åååå eller mm-dd-åååå. Om datumet anges inte överensstämmer med endera formatet, kommer ett felmeddelande att visas. Omdömen

HTML-fil för "Validera dagen genom jQuery" Omdömen

Låt oss göra en HTML-fil som visar en form som innehåller etikett, inmatningsfält, felmeddelande och skicka-knappen. Texten på etiketten är inställd på "Enter Födelsedatum" och att felmeddelande är satt till "Ogiltigt datum.

Dessa fyra punkter är också tilldelas klassnamn som "etikett", "infobox", "fel" och "skicka" respektive. För dessa klassnamn är respektive klassväljarna skrivna i den externa formatmallen. HTML-filen kan se ut så här: Omdömen

Alla fyra objekt på över HTML-fil tilldelas respektive klassnamn: etikett, infobox, errorand submitso att formategenskaperna definieras i klassväljarna som anges i den externa formatmallen stil .csscan tillämpas automatiskt på dessa poster Omdömen

Klass väljare som definieras i formatmallen filen enligt nedan:. Omdömen

style.css Omdömen

.

label {float: left ; width: 150px; }

.infobox {width: 200px; }

.error {color: red; padding-left: 10px; }

.submit {margin-left: 150px; margin-top: 10px;} Omdömen

Kod för "Validera dagen genom jQuery" Omdömen

jQuery kod för att godkänna det datum i formatet mm /dd /åååå eller mm-dd -yyyy är som visas nedan:. Omdömen

$ (dokument) .ready (function () {Omdömen

$ ('. error ") dölja ();

$ ('. submit ' ) .Klicka (funktion (händelse) {Omdömen

Var uppgifter = $ ("infobox.") val ();.

Omdömen

om (validate_date (data)) Review

{

$ ("error".) dölja ();

} Omdömen

annat Omdömen

{Omdömen

$ ('fel.. ') .visa ();

event.preventDefault ();

}

});

});

Funktionen validate_date (datum) Review

{Omdömen

var pattern = new RegExp (/\\ b \\ d {1,2} [\\ /-] \\ d {1,2} [\\ /- ] \\ d {4} \\ b /);

retur pattern.test (datum), Omdömen

} Omdömen

Felmeddelandet osynliggörs i början av ovan jQuery koda. Därefter en click-händelse kopplad till knappen Skicka.

I händelse hanteringsfunktionen för klicket händelsen, det datum som har angetts av användaren i textfältet (som är innesluten i spännvidden elementet av klassnamn "fakta ') hämtas och lagras i" Data "variabel. Den datavariabel skickas till validate_date () funktion för vali

Page   <<       [1] [2] >>
Copyright © 2008 - 2016 läser Utbildning artiklar,https://utbildning.nmjjxx.com All rights reserved.