तरह</p> <pre><code><input id="picker" type="date"> </code></pre> <p>क्रोम

Question

क्रोम में, किसी टैग में एचटीएमएल 5 इनपुट [प्रकार = "तारीख"] से इनपुट मूल्य प्राप्त एक पाठ क्षेत्र के रूप में बना देता है। हालांकि, बुला तरह

$("#picker").val() 

रिटर्न कुछ भी नहीं कुछ के साथ अपने मूल्य प्राप्त करने के लिए जब तक कोई मान्य दिनांक दर्ज किया है या उठाया यह लटकती है से है कोशिश कर रहा। मैं

$("#picker").keypress(function() { 
    var output = "" 
    for (var i in this) {  
     output += i +" value:"+ this[i] + "\n"; 
    } 
    alert(output); 
});​ 

के साथ एक कुंजी दबाने पर वस्तु की तत्काल सभी गुणों की पर एक नज़र लिया, लेकिन इनमें से किसी भी में अपने इनपुट नहीं देख सकता था। अपने आप को http://jsfiddle.net/5cN2q/

मेरा प्रश्न है: क्या इनपुट वैध तिथि नहीं होने पर क्रोम में इनपुट [type = "date"] से टेक्स्ट प्राप्त करना संभव है?

Answer 1

W3C Date State spec को परिभाषित करता है सफ़ाई एल्गोरिथ्म:

• मूल्य सफ़ाई एल्गोरिथ्म इस प्रकार है: यदि तत्व का मान कोई मान्य दिनांक स्ट्रिंग नहीं है, तो यह रिक्त स्ट्रिंग पर बजाय निर्धारित किया है।

जब भी इनपुट तत्व का मान सेटिंग के रूप में परिभाषित किया गया DOM input value spec कौन सा शुरू हो जाती है,:

• हो रही पर, यह तत्व की वर्तमान मान लौटाना चाहिए। सेटिंग में, यह नए मूल्य के तत्व का मान सेट करना होगा सच करने के लिए तत्व का गंदा मूल्य ध्वज सेट, मूल्य सफ़ाई करता है, एल्गोरिथ्म आह्वान करता है, तो तत्व के प्रकार विशेषता के वर्तमान स्थिति एक को परिभाषित करता है, और फिर, अगर तत्व एक टेक्स्ट एंट्री कर्सर स्थिति है, टेक्स्ट एंट्री कर्सर की स्थिति को टेक्स्ट फ़ील्ड के अंत में ले जाएं, किसी भी चयनित टेक्स्ट को अचयनित करना और चयन दिशा को पर रीसेट करना चाहिए।

तो value संपत्ति हमेशा एक खाली स्ट्रिंग होगा जब तिथि मान्य नहीं है। "मूल/गंदे/उपयोगकर्ता-टाइप किए गए टेक्स्ट मान" के लिए निर्दिष्ट कोई प्रतीत नहीं होता है क्योंकि यह सभी के बाद एक टेक्स्ट इनपुट नहीं है।

आईएमओ यह एक अच्छी बात है, यह फॉर्म सत्यापन को सुविधाजनक बनाता है क्योंकि अमान्य तिथियों को गलत मूल्यों (खाली तार) के रूप में माना जाता है, यह ब्राउज़र इनपुट को तारीख इनपुट के लिए अधिक आसानी से कार्यान्वित करने के लिए छोड़ देता है।

यदि आप एक गैर-डब्ल्यू 3 सी डेट इनपुट पसंद करते हैं, तो आप अच्छे पुराने जेएस डेट सत्यापन और डेटपिकर जैसे jQuery UI datepicker के साथ एक टेक्स्ट इनपुट का उपयोग कर सकते हैं। यह आपको इनपुट के वास्तविक पाठ मान को पुनर्प्राप्त करने की अनुमति देगा और साथ ही साथ एक और अधिक क्रॉस-ब्राउज़र समाधान भी होगा।

Answer 2

रूप the other answer आप मूल मूल्य नहीं देख सकते हैं, तो आप फिर भी मान्यता ValidityState

<script type="text/javascript"> 
function submitform() 
{ 
    var inputdate = document.getElementById("inputdate") 
    // check if date is valid. 
    // you can use `inputdate.validity.valid` too. 
    if(inputdate.validity.badInput) { 
    // error message from the browser 
    document.getElementById("message").innerHTML = inputdate.validationMessage 
    } 
    //document.myform.submit(); 
} 
</script> 

<div>message: </div><div id="message" style="color: red; font-weight:bold;"></div> 
<form method=post action="./post"> 
    <input type="date" id="inputdate" value="2016-02-29"> 
    <a href="javascript: submitform()">get date!</a> 
</form> 

साथ संभाल कर सकते हैं आप 30 दिन बदल सकते हैं और लिंक पर क्लिक करें, तो आप एक त्रुटि संदेश दिखाई देगा।

इसका आनंद लें।