Όταν απαιτείται από τους χρήστες να εισαγάγουν μια ημερομηνία, οι προγραμματιστές ορίζουν την προκαθορισμένη/προεπιλεγμένη τιμή μιας ημερομηνίας τύπου εισόδου στην τρέχουσα/σήμερα ημερομηνία. Τώρα, ο χρήστης δεν χρειάζεται να εισαγάγει την ημερομηνία με μη αυτόματο τρόπο, επομένως με αυτή την έννοια εξοικονομεί χρόνο και προσπάθεια για τον χρήστη. Επιπλέον, βελτιώνει την εμπειρία του χρήστη, την ακρίβεια των δεδομένων και παρέχει μεγαλύτερη ευκολία στους χρήστες. Διαθέτει διάφορες εφαρμογές όπως σύστημα διαχείρισης εκδηλώσεων, σύστημα κρατήσεων κ.λπ.
Αυτό το ιστολόγιο δείχνει πώς να ορίσετε την προεπιλεγμένη τιμή της ημερομηνίας τύπου εισαγωγής σε σήμερα:
- Χρήση της ιδιότητας 'valueAsDate'.
- Χρησιμοποιώντας τη μέθοδο 'toISOSstring()'.
- Χρησιμοποιώντας τις μεθόδους 'getFullYear()' και 'padStart()'.
Μέθοδος 1: Χρήση της ιδιότητας 'valueAsDate'.
Ο ' valueAsDate 'η ιδιότητα χρησιμοποιείται για την ανάκτηση της τρέχουσας ημερομηνίας μέσω του ' Ημερομηνία() ' λειτουργία. Αυτή η λειτουργία χρησιμοποιείται για την εκτέλεση διαφόρων λειτουργιών σε μια ημερομηνία και όπως η λήψη της τρέχουσας ημερομηνίας, ο ορισμός μιας συγκεκριμένης ημερομηνίας, ο χειρισμός ημερομηνιών κ.λπ.
Επισκεφτείτε τον παρακάτω κώδικα για καλύτερη κατανόηση:
< σώμα >
< div >
< επιγραφή Για = 'Σήμερα Ημερομηνία' > Η ημερομηνία είναι επιγραφή >< εισαγωγή τύπος = 'ημερομηνία'
ταυτότητα = 'Σήμερα Ημερομηνία' >
div >
< γραφή >
document.getElementById ( 'Σήμερα Ημερομηνία' ) .valueAsDate = νέα Ημερομηνία ( ) ;
γραφή >
σώμα >
Στο παραπάνω απόσπασμα κώδικα:
- Πρώτον, το « <εισαγωγή> 'Η ετικέτα δημιουργείται με ' τύπος ' και ' ταυτότητα Τα χαρακτηριστικά ορίστηκαν σε ' δεδομένα ' και ' σήμεραΗμερομηνία ” αντίστοιχα. Αυτή η ετικέτα ' ' πρόκειται να χρησιμοποιηθεί σε όλο το ιστολόγιο.
- Στη συνέχεια, μέσα στο « <σενάριο> ' Προσθέστε ετικέτα στο στοιχείο HTML με αναγνωριστικό ' σήμεραΗμερομηνία Το ' επιλέγεται χρησιμοποιώντας το ' getElementById() 'μέθοδος.
- Μετά από αυτό, το « valueAsDate 'η ιδιότητα εκχωρείται και αποθηκεύεται ως παρουσία ενός νέου ' Ημερομηνία() ” κατασκευαστής.
Μετά την εκτέλεση του παραπάνω αποσπάσματος κώδικα, η ιστοσελίδα μοιάζει με αυτό:
Η έξοδος δείχνει ότι τα δεδομένα τύπου εισόδου έχουν μια προεπιλεγμένη τιμή που έχει οριστεί στην τρέχουσα/σήμερα ημερομηνία.
Μέθοδος 2: Χρήση της μεθόδου “toISOSstring()”.
Για τον ορισμό της προεπιλεγμένης τιμής σήμερα για το ' εισαγωγή ' στοιχείο μέχρι σήμερα/τρέχουσα ημερομηνία. Ο ' toISOSstring() Η μέθοδος ” μπορεί επίσης να χρησιμοποιηθεί, για καλύτερη εξήγηση, επισκεφτείτε το παρακάτω απόσπασμα κώδικα:
< γραφή >const σήμερα = νέα Ημερομηνία ( ) .toISOSstring ( ) .υποστρ ( 0 , 10 ) ;
document.getElementById ( 'Σήμερα Ημερομηνία' ) .value = σήμερα;
γραφή >
Στο παραπάνω απόσπασμα κώδικα:
- Πρώτον, το νέο παράδειγμα του « Ημερομηνία() ” δημιουργείται ο κατασκευαστής. Μετά από αυτό, μετατρέψτε την παρουσία της ημερομηνίας σε ' ISO 'πρότυπο χρησιμοποιώντας το ' toISOSstring() 'μέθοδος.
- Στη συνέχεια, χρησιμοποιήστε το ' substr() ' μέθοδος λήψης αριθμών ευρετηρίου ' 0 ' και ' 10 ” ως παράμετρος. Μετά από αυτό, εμφανίζει το αποτέλεσμα ξεκινώντας από το ' 0 ' ευρετήριο στο ' 10 ευρετήριο.
Μετά την εκτέλεση της παραπάνω μεθόδου, η ιστοσελίδα εμφανίζεται ως εξής:
Η έξοδος δείχνει ότι τα δεδομένα τύπου εισόδου έχουν μια προεπιλεγμένη τιμή που έχει οριστεί στην τρέχουσα/σήμερα ημερομηνία.
Μέθοδος 3: Χρήση των μεθόδων 'getFullYear()' και 'padStart()'
Σε αυτή την ενότητα, το « getFullYear() Η μέθοδος εξάγει την τρέχουσα ημερομηνία. Ο ' pathStart() Χρησιμοποιείται η μέθοδος που βοηθά στη μορφοποίηση του ημερομηνία ' μορφή που θα εμφανίζεται στο στοχευμένο ' εισαγωγή ' στοιχείο:
< γραφή >συνθ ρεύμα = νέα Ημερομηνία ( ) ;
const τρέχον έτος = τρέχον.getFullYear ( ) ;
const τρέχον-μήνας = Συμβολοσειρά ( τρέχον.getMonth ( ) + 1 ) .padStart ( 2 , '0' ) ;
const τρέχουσα-ημέρα = Συμβολοσειρά ( current.getDate ( ) ) .padStart ( 2 , '0' ) ;
const formattedDate = ` ${τρέχον έτος} - ${current-month} - ${current-day} ` ;
const myDateInput = document.getElementById ( 'το ραντεβού μου' ) ;
myDateInput.value = formattedDate;
γραφή >
Η περιγραφή των παραπάνω αποσπασμάτων κώδικα περιγράφεται σε σημεία κουκκίδων:
- Αρχικά, δημιουργήστε έναν σταθερό τύπο μεταβλητής που αποθηκεύει το αντικείμενο του ' Ημερομηνία() 'κατασκευαστής με το όνομα' ρεύμα '.
- Στη συνέχεια, χρησιμοποιήστε το ' getFullYear() μέθοδος με το « ρεύμα ' μεταβλητή και αποθηκεύστε την σε μια νέα μεταβλητή με το όνομα ' τρέχον έτος '.
- Στη συνέχεια, περάστε το ' getMonth() ' μέθοδο και προσθέστε έναν αριθμό για να ξεκινήσει ο μήνας από το 1 έως το 12 μέσα στο ' Σειρά() ” κατασκευαστής. Παρέχετε επίσης μια συμπλήρωση δύο χαρακτήρων χρησιμοποιώντας το ' pathStart(2, 0) '. Και τοποθετήστε το σε μια μεταβλητή που δημιουργήθηκε πρόσφατα με το όνομα ' τρέχον μήνα '.
- Στη συνέχεια, ακολουθήστε την ίδια διαδικασία για να λάβετε την τρέχουσα ημερομηνία χρησιμοποιώντας το ' getDate() ' μέθοδο και αποθηκεύστε το στο ' τρέχουσα ημέρα ” μεταβλητή.
Μετά την εκτέλεση των αποσπασμάτων κώδικα, η ιστοσελίδα σε κάθε περίπτωση εμφανίζεται ως εξής:
Η έξοδος δείχνει ότι τα δεδομένα τύπου εισόδου έχουν μια προεπιλεγμένη τιμή που έχει οριστεί στην τρέχουσα/σήμερα ημερομηνία.
συμπέρασμα
Για να ορίσετε την προεπιλεγμένη τιμή ημερομηνίας τύπου εισόδου σε σήμερα/τρέχουσα ημερομηνία, το ' valueAsDate «περιουσία, το « toISOSstring() ' και ' getFullYear() μπορούν να χρησιμοποιηθούν μέθοδοι. Στην περίπτωση της ιδιότητας 'valueAsDate', μόνο το ' Ημερομηνία() ' χρειάζεται κατασκευαστής ενώ στην περίπτωση του ' toISOSstring() 'μέθοδοι ' substr() ' η μέθοδος χρησιμοποιείται για να ληφθεί μόνο ένα συγκεκριμένο μέρος της ημερομηνίας. Αυτό το ιστολόγιο δείχνει πώς να ορίσετε την προεπιλεγμένη τιμή ημερομηνίας τύπου εισόδου σε σήμερα/τρέχουσα.