कृपया मेरे पास एक जावास्क्रिप्ट उलटी गिनती टाइमर कोड है जो मुझे स्टैक ओवरफ्लो से मिला है जो मेरी उलटी गिनती टाइमर प्रोजेक्ट का समाधान है। यह मौजूदा कोड समय को 30 मिनट से घटाकर 1 कर देता है और फिर से शुरू करता है। और यह एक ही समय में प्रत्येक उपयोगकर्ता को समान गणना परिणाम देता है। लेकिन कोड के साथ मेरी चुनौती यह है कि मैं गिनती अवधि को विनियमित करने में सक्षम होने के लिए इसे अन्य में संशोधित करने में सक्षम नहीं था, क्योंकि मैं चाहता हूं कि यह 2 मिनट से 0 तक उलटी गिनती हो और लगातार फिर से शुरू हो, लेकिन 2 मिनट से अधिक नहीं। कृपया मुझे किसी ऐसे व्यक्ति की आवश्यकता है जो इस कोड को कॉपी करे और यह देखे कि क्या आप अवधि को विनियमित कर सकते हैं और समाधान के साथ मेरी मदद कर सकते हैं। प्रत्याशा में धन्यवाद।
कोड इस प्रकार है:
setInterval(function() {
function addZero(i) {
if (i < 10) {
i = "0" + i;
}
return i;
}
var x = document.getElementById("timer");
var d = new Date();
var s = (d.getSeconds());
var m = (d.getMinutes());
var a = addZero(30 - m);
var b = addZero(60 - m);
var c = (60 - s);
var z = "<span style='color:red;font-size:50px;'>" + "Break" + "</span>";
var v = "<span style='color:black;font-size:24px;'>" + "Break" + "</span>";
if (m > 30) {
y = b;
}
else if (m < 30) {
y = a;
}
if (y < 2 && c < 15) {
q = z;
}
else {
q = v;
}
var t = y + (":" + addZero(c) + " Till Station " + (q));
x.innerHTML = t;
}, 250);
<div align="center" id="timer" style='color:black;font-size:24px;' ></div>
1 उत्तर
आपके द्वारा प्रस्तुत कोड कुछ टिप्पणियों के योग्य है:
- चर नाम वर्णनात्मक होने चाहिए, न कि एक अक्षर a, b, c...
- चरों को स्पष्ट रूप से परिभाषित किया जाना चाहिए, परोक्ष रूप से वैश्विक नहीं, जैसा कि अब
y
औरq
के लिए होता है - जब
m
30 है, तबy
का कोई मान नहीं मिलता... यह सही नहीं हो सकता। - यदि उस अंतिम बिंदु को ठीक कर दिया जाता, तो
z
सेट करने का तर्क एक नई समस्या उत्पन्न कर देता। - स्टाइलिंग को यथासंभव सीएसएस कक्षाओं के माध्यम से किया जाना चाहिए, न कि
style
विशेषता सेटिंग्स के माध्यम से।
यहां बताया गया है कि आप इसे कैसे कर सकते हैं। आप अपनी पसंद के अनुसार पहले दो स्थिरांक सेट कर सकते हैं:
// Maximum number of seconds for the timer (e.g. 120 = 2 minutes)
const MAX_SECS = 120;
// Number of seconds below which text gets highlighted
const WARN_SECS = 15;
// DOM
const spanMinutes = document.getElementById("min");
const spanSeconds = document.getElementById("sec");
const spanWarning = document.getElementById("break");
// For formatting numbers with 2 digits
const twoDigits = i => i.toString().padStart(2, 0);
setInterval(() => {
let seconds = MAX_SECS - Math.floor(Date.now() / 1000) % MAX_SECS;
spanMinutes.textContent = twoDigits(Math.floor(seconds / 60))
spanSeconds.textContent = twoDigits(seconds % 60);
spanWarning.classList.toggle("warn", seconds < WARN_SECS);
}, 250);
#timer {
text-align: center;
font-size: 24px;
}
.warn {
color: red;
}
<div id="timer"><span id="min">00</span>:<span id="sec">00</span>
till station <span id="break">breaks down</break>
</div>
a
,b
,c
... और चर को स्पष्ट रूप से परिभाषित किया जाना चाहिए, न कि स्पष्ट रूप से वैश्विक, जैसेy
याq
. इसे स्वयं बेहतर प्रोग्राम करें।