मैं किसी दिनांक प्रकार के इनपुट प्रकार का मान कैसे पास करूं?

Question

यह समारोह इस कार्य के लिए स्टैक ओवरफ़्लो पर एक योगदानकर्ता के प्रारूप 12hr के लिए समय, क्रेडिट धर्मान्तरित:

जे एस

function ampm(date) { 
    var hours = date.getHours(); 
    var minutes = date.getMinutes(); 
    var ampm = hours >= 12 ? 'pm' : 'am'; 
    hours = hours % 12; 
    hours = hours ? hours : 12; // 0 should be 12 
    minutes = minutes < 10 ? '0'+minutes : minutes; // if minutes less than 10, add a 0 in front of it ie: 6:6 -> 6:06 
    var strTime = hours + ':' + minutes + ' ' + ampm; 
    document.getElementById('time').value = strTime; 
    return strTime; 
} 

////This is how the value of the time input is supposed to be displayed in 12 hr format 
_("display_time").innerHTML = ampm(new Date()); 

एचटीएमएल

<!--This is the input field where a user selects a time--> 
<input id="time" placeholder="Time" type="time" name="time" /> 




<!--This is where the value of the time input is supposed to be displayed in 12 hr format-->> 
<span id="display_time"></span> 

मेरा प्रश्न कैसे करना है मुझे 12hr प्रारूप में अवधि टैग पर प्रदर्शित होने के लिए इनपुट इनपुट फ़ील्ड का मान मिलता है। यह कोड अर्द्ध काम कर रहा है।

यह 12hr प्रारूप में समय प्रदर्शित लेकिन केवल वर्तमान समय प्रदर्शित करता है। प्रवाह चार्ट होगा कुछ की तरह, उपयोगकर्ता समय इनपुट में समय का चयन करता है -> कुछ जे एस 12hr प्रारूप में बदलने के लिए -> स्पैन टैग में 12hr प्रारूप के रूप में प्रदर्शन। कोई सलाह या सुझाव?

Answer 1

Date और उसके तरीकों का उपयोग करने के लिए इनपुट एक String है ताकि आप बेहतर .split(":") विधि का उपयोग करें और आप hours और minutes मूल्यों सीधे मिल जाएगा कोई ज़रूरत नहीं है।

तो बस अगर उनके मूल्यों की तुलना में कम कर रहे हैं 10 का परीक्षण जोड़ने के एक अग्रणी 0 और अगर hours से अधिक 12 उपयोग pm प्रत्यय या अन्यथा am का उपयोग करें।

function ampm(time) { 
 

 
    console.log(time); 
 
    if (time.value !== "") { 
 
    var hours = time.split(":")[0]; 
 
    var minutes = time.split(":")[1]; 
 
    var suffix = hours >= 12 ? "pm" : "am"; 
 
    hours = hours % 12 || 12; 
 
    hours = hours < 10 ? "0" + hours : hours; 
 

 
    var displayTime = hours + ":" + minutes + " " + suffix; 
 
    document.getElementById("display_time").innerHTML = displayTime; 
 
    } 
 
}

<!--This is the input field where a user selects a time--> 
 
<input id="time" placeholder="Time" type="time" name="time" onchange="ampm(this.value)" /> 
 
<span id="display_time"></span>

Answer 2

आपका इनपुट मान एक स्ट्रिंग, नहीं एक तारीख हो जाएगा। मैं एक jsfiddle सेट कर लेते हैं, जहां मैं एक स्ट्रिंग पर काम करने के लिए अपने जावास्क्रिप्ट संशोधित कर लिया है।

$('#time').on('change', function() { 
    var date = $('#time').val().split(':'); 

    var hours = date[0]; 
    var minutes = date[1]; 

    $('#display_time').text(ampm(hours, minutes)); 
}); 

function ampm(hours, minutes) { 
    var ampm = hours >= 12 ? 'pm' : 'am'; 
    hours = hours % 12 || 12; 
    minutes = minutes || 0; 
    minutes = minutes < 10 ? '0'+minutes : minutes; 
    return hours + ':' + minutes + ' ' + ampm; 
} 

Answer 3

कुछ इस तरह यह

function showTime() { 
    //Grab the time and split into hrs and mins 
    var time = document.getElementById("time"); 
    if (time.value === "") { 
     document.getElementById("mySpan").innerHTML = ""; 
     return false; 
    } 
    var hrs = time.value.split(":")[0]; 
    var mins = time.value.split(":")[1]; 
    var newTime = ampm(hrs, mins); 
    document.getElementById("mySpan").innerHTML = newTime; 
} 

function ampm(hrs, mins) { 
    return (hrs % 12 || 12) + ":" + mins + ((hrs >= 12) ? "PM" : "AM"); 
} 

Here एक एक उदाहरण है क्या करेंगे। showTime() बस समय इनपुट के बदले चलने की जरूरत है।