एचटीएमएल कक्षा

Question

के साथ समय रिकॉर्ड के आधार पर खुला/बंद कैसे दिखाएं मैं जावास्क्रिप्ट का उपयोग कर उस विशिष्ट तारीख के लिए किसी कंपनी के समय के आधार पर खुला या बंद प्रदर्शित करने की कोशिश कर रहा हूं। मैं एक थीम का उपयोग कर रहा हूं वर्डप्रेस पर सूचीबद्ध करें जो ग्राहक अपने व्यवसाय सूचीबद्ध कर सकते हैं। उनके पास सप्ताह के प्रत्येक दिन के लिए अपने व्यावसायिक घंटे लगाने का विकल्प होता है। मैं उस डेटा का उपयोग करने में सक्षम होना चाहता हूं जो एक अवधि के भीतर संग्रहीत होता है और फिर यह निर्धारित करता है कि व्यवसाय खुला है या बंद है और उसे प्रदर्शित करता है।

यहाँ कोड मैं अब तक है:

<p class="business-hour" itemprop="openingHours" content="Monday 8am-17pm"> 
    <span class="day">Monday</span> 
    <span class="business-hour-time"> 
     <span class="start">8:30 am</span> – <span class="end">5:30 pm</span> 
    </span> 
</p> 

यह सिर्फ एक दिन के लिए है, लेकिन आप विचार प्राप्त करना चाहिए। मैं इस तरह कुछ खोजने के लिए घंटों के लिए देख रहा हूं। मैं जो कुछ भी पा सकता हूं वह जावास्क्रिप्ट के भीतर पहले से निर्धारित विशिष्ट घंटों के साथ कोडिंग कर रहा है। मैं खुले या बंद बनाने के लिए कक्षाओं की शुरुआत और अंत का उपयोग करने में सक्षम होना चाहता हूं। क्या यह संभव है? मुझे लगता है कि यह है। मैं बस इसे सही ढंग से नहीं कर सकता।

मैं यहाँ अभ्यास कर रहे है, लेकिन कुछ भी पता लगाने की प्रतीत नहीं कर सकते हैं: http://codepen.io/tetonhiker/pen/KzxRzg

धन्यवाद!

Answer 1

मैं अपने कोड एक छोटे से, date.js का इस्तेमाल कर रही संशोधित कर लिया है:

http://codepen.io/anon/pen/VaGdBK

var da = new Date(); 
 
document.getElementById("display").innerHTML = da.toDateString(); 
 

 

 

 

 
//gets the current time. 
 
//var d = new Date(); 
 
var x = document.getElementsByClassName("start")[0].innerText; 
 
var z = document.getElementsByClassName("end")[0].innerText; 
 
//var o = parseInt(x,10); 
 
//var c = parseInt(z,10); 
 

 
var startTime = Date.parseExact(x, "h:mm tt"); 
 
var endTime = Date.parseExact(z, "h:mm tt"); 
 

 
if (da.between(startTime, endTime)){ 
 
    $(".open").show(); 
 
    $(".closed").hide(); 
 
} 
 
else { 
 
    $(".closed").show(); 
 
    $(".open").hide(); 
 
}

.open, .closed { 
 
    display: none; 
 
}

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script> 
 
<span class="day">Monday </span> 
 
<span class="start">8:30 am</span> - 
 
<span class="end">5:30 pm</span> 
 
<br> 
 
<span id="display"></span> 
 
<div class="open">Shop is open</div> 
 
<div class="closed">Shop is closed</div>

मैं इसे में देखा नहीं किया है पर्याप्त रूप से तो मैं नहीं जानता कि यह टाइमज़ोन के संबंध में कैसे काम करता है। इसके लिए आपको जो कुछ पोस्ट किया है उसे समायोजित करना पड़ सकता है।

इसके अलावा: उनमें से एक को jQuery द्वारा छुपाए जाने से पहले खुले और बंद दोनों के संक्षिप्त फ्लैश से बचने के लिए एक सीएसएस नियम जोड़ा गया।