Datuma un laika ievades veidošana tīmekļa veidlapās - Plašs rokasgrāmata

Šajā rokasgrāmatā es tev parādīšu, kā varēsi implementēt datumu un laika ievades tīmekļa veidlapās. Es izskatīšu dažādos ievades tipus, kas ir pieejami, un sniegšu tev noderīgus padomus par praktisko pielietojumu. Mēs apspriedīsim gan datumu, gan laika ievadi, lai iegūtu pamatīgu izpratni par šo funkciju implementāciju.

Svarīgākās atziņas

• Ievades tips date ļauj izvēlēties tikai datumu.
• Ievades tips dateTime-local apvieno datumu un laiku bez laika joslas pielāgojuma.
• Datu un laika norādījumu formatēšana notiek standartizēti pēc ISO 8601.
• Pārlūki var atšķirties ar datuma un laika ievades atspējām.

Datuma un laika ievades pamati

Lai implementētu datumu un laika ievades tīmekļa veidlapās, tev būs nepieciešami HTML ievades tipi date, dateTime-local un time. date ievades tips ļauj lietotājam izvēlēties datumu, kamēr dateTime-local tips reģistrē gan datumu, gan laiku. Tas tiek nosūtīts bez laika joslas pielāgojuma, kas nozīmē, ka ievade tiek nosūtīta uz serveri tāda, kādu to veic lietotājs.

Tagad apskatīsim šos tipus detalizēti.

Ievades tipa date izmantošana

Lai iegūtu tikai datumu, vari izmantot tipu date. Tas ļauj lietotājam izvēlēties datumu, izmantojot iebūvēto kalendāra rīku, kas uzlabo lietotājam draudzīgumu.

Kad atver kalendāra rīku, vari izvēlēties dažādus datumus un tos iesniegt, nospiežot "Iesniegt". Šajā procesā datums tiek pārsūtīts standartizētā formātā: Gads-Mēnesis-Diena.

Svarīgi zināt, ka kalendāra attēlojums var atšķirties atkarībā no pārlūka. Tavi operētājsistēmas iestatījumi ietekmē datuma attēlošanas formātu.

Datuma un laika ievades ar dateTime-local

Ja vēlies reģistrēt gan datumu, gan laiku, ir ieteicams izmantot tipu dateTime-local. Tas darbojas līdzīgi kā datuma reģistrēšana, bet papildus var norādīt arī laiku.

Tev būs iespējams izvēlēties gan dienu, gan laiku. Interesanti, ka laiks tiks parādīts 24 stundu formātā, ja tavs vietējais iestatījums neaktivizē AM/PM formātu.

Kad iesniedz veidlapu, arī dati tiks saņemti ISO formātā, un laiks paliks nemainīts, netiks pārvērsts citā laika joslā.

Laika izmantošana

Lai norādītu tikai laiku bez datuma, ir iespējams izmantot laika tipu. Ar šo tipu būs iespējams izvēlēties laiku, kas tiks pārsūtīts arī 24 stundu formātā.

Citas datumu formātu integrācijas

Papildus minētajiem tipiem ir iespējams ieviest arī nedēļu (week) un mēneša (month) ievades iespējas. Ar week formātu būs iespējams norādīt konkrētas nedēļas un vienkārši izvēlēties vēlamo nedēļu.

Mēneša formātam attiecas līdzīgs princips. Šeit būs iespējams izvēlēties tikai mēnesi, neaizskarot konkrētus datumus.

Priekšizvēles un vērtības

Vēl viens noderīgs padoms ir iespēja iestatīt priekšizvēles savām ievades laukām. Piemēram, varēsi noteikt, ka datuma un laika izvēlē jau ir iepriekš standarta iestatījumi.

Laika joslas un pārlūka saderība

Galvenais aspekts, izmantojot datuma un laika norādes, ir laika zona. Ievades tiek saglabātas tādā veidā, kā tās tiek ievadītas lokāli. Laika joslu pielāgojumi šajā kontekstā nav nepieciešami, tāpēc tu vari nodot lokālo laiku tieši.

Tomēr ir svarīgi pievērst uzmanību tam, ka šo ievades veidu atbalsts var atšķirties atkarībā no pārlūka. Lai gan date un dateTime-local ir atbalstīti gandrīz visos populārajos pārlūkos, ieteicams pārliecināties, izmantojot vietni "Can I use", vai konkrētie funkcijas darbojas tavas mērķauditorijas pārlūkos.

Kopsavilkums

Tu tagad esi ieguvis pārskatu par datuma un laika ievades implementēšanu savos tīmekļa veidlapās. Tu zini dažādus ievades tipus, to formātus un lietotāju iestatījumu nozīmi. Atceries, ka pareizs formatējums un pārlūka atbalsts ir būtiski, lai nodrošinātu nenoturīgu pieredzi tavam lietotājiem.