जब उपयोगकर्ताओं को एक तिथि दर्ज करने की आवश्यकता होती है, तो डेवलपर्स इनपुट प्रकार की तारीख के पूर्व-निर्धारित/डिफ़ॉल्ट मान को वर्तमान/आज की तारीख पर सेट करते हैं। अब, उपयोगकर्ता को मैन्युअल रूप से दिनांक दर्ज करने की आवश्यकता नहीं है, इस अर्थ में यह उपयोगकर्ता के लिए समय और प्रयास बचाता है। इसके अलावा, यह उपयोगकर्ता अनुभव, डेटा की सटीकता को बढ़ाता है और उपयोगकर्ताओं के लिए अधिक सुविधा प्रदान करता है। इसमें विभिन्न अनुप्रयोग हैं जैसे इवेंट मैनेजमेंट सिस्टम, बुकिंग सिस्टम इत्यादि।
यह ब्लॉग प्रदर्शित करता है कि इनपुट प्रकार दिनांक के डिफ़ॉल्ट मान को आज कैसे सेट किया जाए:
- “ValueAsDate” प्रॉपर्टी का इस्तेमाल करना
- 'toISOString ()' विधि का उपयोग करना
- 'GetFullYear ()' और 'padStart ()' विधियों का उपयोग करना
पहला तरीका: “ValueAsDate” प्रॉपर्टी का इस्तेमाल करना
' valueAsDate 'संपत्ति का उपयोग' के माध्यम से वर्तमान तिथि को पुनः प्राप्त करने के लिए किया जाता है तारीख() ' समारोह। इस फ़ंक्शन का उपयोग किसी दिनांक पर विभिन्न ऑपरेशन करने के लिए किया जाता है और जैसे वर्तमान दिनांक प्राप्त करना, विशिष्ट दिनांक सेट करना, दिनांकों में हेरफेर करना आदि।
बेहतर समझ के लिए नीचे दिए गए कोड पर जाएँ:
< शरीर >
< डिव >
< लेबल के लिए = 'आज की तारीख़' > तारीख है लेबल < इनपुट प्रकार = 'तारीख'
पहचान = 'आज की तारीख़' >
डिव >
< लिखी हुई कहानी >
document.getElementById ( 'आज की तारीख़' ) .valueAsDate = नई तारीख ( ) ;
लिखी हुई कहानी >
शरीर >
उपरोक्त कोड स्निपेट में:
- पहले ' <इनपुट> ” टैग बनाया गया है “ प्रकार ' और ' पहचान 'विशेषताएँ' पर सेट आंकड़े ' और ' आज की तारीख़ ' क्रमश। यह “ ” टैग पूरे ब्लॉग में उपयोग किया जाएगा।
- अगला, अंदर ' <स्क्रिप्ट> 'एक आईडी वाले HTML तत्व को टैग करें' आज की तारीख़ 'का उपयोग करके चुना गया है' getElementById () ' तरीका।
- उसके बाद, ' valueAsDate 'संपत्ति को एक नए उदाहरण के रूप में सौंपा और संग्रहीत किया जाता है' तारीख() ” कंस्ट्रक्टर।
उपरोक्त कोड स्निपेट के निष्पादन के बाद, वेबपेज इस तरह दिखता है:
आउटपुट दिखाता है कि इनपुट प्रकार के डेटा में एक डिफ़ॉल्ट मान वर्तमान/आज की तारीख पर सेट है।
विधि 2: 'toISOString ()' विधि का उपयोग करना
के लिए डिफ़ॉल्ट आज मान सेट करने के लिए इनपुट ” तत्व आज / वर्तमान तिथि के लिए। ' toISOString () ” विधि का भी उपयोग किया जा सकता है, बेहतर स्पष्टीकरण के लिए कोड स्निपेट के नीचे जाएं:
< लिखी हुई कहानी >कॉन्स्ट आज = नई तारीख ( ) .toISOString ( ) .substr ( 0 , 10 ) ;
document.getElementById ( 'आज की तारीख़' ) मूल्य = आज;
लिखी हुई कहानी >
उपरोक्त कोड स्निपेट में:
- सबसे पहले, 'का नया उदाहरण तारीख() ” कंस्ट्रक्टर बनाया गया है। उसके बाद, दिनांक के उदाहरण को 'में बदलें' आईएसओ 'मानक' का उपयोग कर toISOString () ' तरीका।
- अगला, 'का उपयोग करें पदार्थ () 'की अनुक्रमणिका संख्या लेने की विधि' 0 ' और ' 10 'एक पैरामीटर के रूप में। उसके बाद, यह 'से शुरू होने वाले परिणाम को प्रदर्शित करता है 0 'के लिए सूचकांक' 10 ' अनुक्रमणिका।
उपरोक्त विधि के निष्पादन के बाद, वेबपेज इस तरह दिखाई देता है:
आउटपुट दिखाता है कि इनपुट प्रकार के डेटा में एक डिफ़ॉल्ट मान वर्तमान/आज की तारीख पर सेट है।
विधि 3: 'getFullYear ()' और 'padStart ()' विधियों का उपयोग करना
इस खंड में, ' getFullYear() ' विधि वर्तमान तिथि निकालती है। ' पाथस्टार्ट () ” विधि का उपयोग किया जाता है जो “ को स्वरूपित करने में मदद करता है” तारीख 'प्रारूप जो लक्षित पर प्रदर्शित किया जाएगा' इनपुट ' तत्व:
< लिखी हुई कहानी >कॉन्स्ट मौजूदा = नई तिथि ( ) ;
const चालू-वर्ष = current.getFullYear ( ) ;
const चालू माह = String ( current.getMonth ( ) + 1 ) पैडस्टार्ट ( 2 , '0' ) ;
const वर्तमान-दिन = String ( वर्तमान.getDate ( ) ) पैडस्टार्ट ( 2 , '0' ) ;
कॉन्स्ट स्वरूपित दिनांक = ` ${वर्तमान-वर्ष} - ${वर्तमान-माह} - ${वर्तमान दिन} ` ;
const myDateInput = document.getElementById ( 'मेरी तारीख' ) ;
myDateInput.value = स्वरूपित दिनांक;
लिखी हुई कहानी >
उपरोक्त कोड स्निपेट का विवरण बुलेट बिंदुओं में वर्णित है:
- सबसे पहले, एक स्थिर प्रकार का वेरिएबल बनाएं जो 'की वस्तु को संग्रहीत करता है' तारीख() 'नाम के साथ निर्माता' मौजूदा ”।
- अगला, 'का उपयोग करें getFullYear() 'विधि के साथ' मौजूदा 'वैरिएबल और इसे' नामक एक नए वेरिएबल में स्टोर करें चालू वर्ष ”।
- फिर, 'पास करें' महीने प्राप्त करें () 'विधि और' के अंदर 1 से 12 तक महीने शुरू करने के लिए एक संख्या जोड़ें डोरी() ” कंस्ट्रक्टर। उपयोग करके दो वर्णों की पैडिंग भी प्रदान करें ' पाथस्टार्ट (2, 0) ”। और इसे एक नए बनाए गए वेरिएबल में रखें जिसका नाम है “ अभी चल रहा माह ”।
- अगला, 'का उपयोग करके वर्तमान तिथि प्राप्त करने के लिए उसी प्रक्रिया का पालन करें' तारीख लें() 'विधि और इसे' में संग्रहीत करें वर्तमान दिन ' चर।
कोड स्निपेट के निष्पादन के बाद, प्रत्येक मामले में वेबपेज इस तरह दिखाई देता है:
आउटपुट दिखाता है कि इनपुट प्रकार के डेटा में एक डिफ़ॉल्ट मान वर्तमान/आज की तारीख पर सेट है।
निष्कर्ष
इनपुट प्रकार दिनांक डिफ़ॉल्ट मान को आज/वर्तमान दिनांक पर सेट करने के लिए, ' valueAsDate 'संपत्ति,' toISOString () ' और ' getFullYear() ” विधियों का उपयोग किया जा सकता है। “ValueAsDate” संपत्ति के मामले में, केवल “ तारीख() 'कंस्ट्रक्टर की जरूरत है जबकि' के मामले में toISOString () 'तरीके' पदार्थ () तिथि का केवल एक विशिष्ट भाग प्राप्त करने के लिए विधि का उपयोग किया जाता है। यह ब्लॉग प्रदर्शित करता है कि इनपुट प्रकार दिनांक डिफ़ॉल्ट मान को आज/वर्तमान में कैसे सेट किया जाए।