我有一个倒计时脚本:
/** WebSocket Setup */
//var ws = new WebSocket("CONFIG.WEBSOCKET_CONNECTION_PATH");
// jt localhost testing
var time = .25 * 60; // change first number for minutes to countdown
var constantTime = time;
var refreshIntervalId;
var start = false;
var countdown = document.getElementById("countdown");
function connect() {
const ws = new WebSocket("ws:localhost:8000");
ws.onopen = function (event) {
sendGeneralMessage('history_timer_1', 'new_client');
};
ws.onmessage = function (event) {
// parse into json, otherwise stop processing
try {
// clearInterval(refreshIntervalId);
var payload = JSON.parse(event.data);
console.log("RECEIVED: " + event.data);
// continue processing if "event" field exists, stop processing otherwise
if (payload.hasOwnProperty("event")) {
console.log("has event field");
// start clock is value is start, stop clock if value is stop, stop otherwise
if (payload.event == "start" || payload.event == "stop") {
if (time != 0)
time = constantTime;
start = payload.event == "start";
console.log("start: " + start);
updateCountdown();
}
else {
console.log("value is not start or stop");
clearInterval(refreshIntervalId);
countdown.innerHTML = "00:00";
}
}
else {
console.log("has no event field");
clearInterval(refreshIntervalId);
countdown.innerHTML = "00:00";
}
} catch(e) {
console.log("RECEIVED: " + event.data);
}
};
ws.onclose = function(event) {
console.log("CONNECTION CLOSED");
setTimeout(function() {
connect();
}, 1000);
};
ws.onerror = function(event) {
console.log("ERROR");
};
}
connect();
function sendGeneralMessage(clientID, event) {
var message = {client_id:clientID, event: event};
// console.log(JSON.stringify(message))
ws.send(JSON.stringify(message));
}
function updateCountdown() {
if (!start)
time = 0;
// clearInterval(refreshIntervalId);
refreshIntervalId = setInterval(function() {
let minutes = Math.floor(time / 60);
let seconds = time % 60;
minutes = minutes < 10 ? '0' + minutes : minutes; //turns single digit minutes to double
seconds = seconds < 10 ? '0' + seconds : seconds; //turns dingle digit seconds to double
countdown.innerHTML = `${minutes}:${seconds}`;
time--;
if (time < 0) { //stop the setInterval to avoid negative time
clearInterval(refreshIntervalId);
}
}, 1000);
}
字符串
当“值不是开始或停止”或“没有”事件“字段”时,我希望计时器停止倒计时并显示00:00。
现在,当计时器正在倒计时并且上面提到的两个事件之一发生时,计时器显示00:00一瞬间,并从00:00之前停止的地方开始倒计时。
我可以做些什么,让时钟停止倒计时并显示00:00?clearInterval不起作用,是我用错了吗?
编辑:这是我在我的服务器端测试它
ws.on("message", (message) => {
console.log("received %s", message);
setTimeout(function () {
var msg = JSON.stringify({event:"start"});
ws.send(msg);
console.log("sent %s", msg);
}, 3000);
setTimeout(function () {
var msg = JSON.stringify("hello");
ws.send(msg);
console.log("sent %s", msg);
}, 8000);
});
型
当发送“hello”时,即 Flink 00:00,然后从开始事件开始继续倒计时。
1条答案
按热度按时间zaqlnxep1#
字符串