[英]WebClientPrint for client-side printing javascript issue on Chrome
[英]Debug a Javascript issue properly? (most likely client-side)
这个问题很可能是客户端的,但是我不确定。 这是关于一个拍卖网站的信息,我每秒通过WebSocket(node.js服务器)获取数据(价格,剩余时间)。
如果价格发生变化,我的脚本会自动触发一个事件,其中该拍卖的倒计时和价格会闪烁,并且我的数组timers
会在剩下的秒数内刷新( auction.duration
):
if ($('.price' + timers[i][0]).data('curr_text') !== $('.price' + timers[i][0]).text())
{
$(".flashing" + timers[i][0]).toggle("highlight").toggle("highlight");
timers[i][1] = auction.duration;
}
因此,我大约呆了几个小时,有些拍卖计时器设为零(显示为00:00:00
),但不是所有计时器。 当我刷新页面时,这些拍卖仍在进行中,因此这很可能是客户端JavaScript问题。 还有一个很大的问题,因为用户认为拍卖已结束,因此刷新页面并会注意到它实际上仍在运行。
由于某些计时问题,我只能猜测会发生此问题,但我不确定。 另外,我也不知道如何调试此问题,因为我无法在屏幕上凝视数小时以等待发生这种情况。 因此,我希望您能提出调试建议。
我认为向您展示我的完整代码也很有帮助,也许您会看到我所缺少的内容:
// prevent flashing after page loaded
$(".refresh-item").each(function() {
$this = $(this);
var id = $this.attr("data-id");
$('.price' + $this.attr("data-id")).data('curr_text', $('.price' + id).text());
});
// format timer
var formatSeconds = function(secs){
var pad = function(n) {
return (n < 10 ? "0" + n : n);
};
var h = Math.floor(secs / 3600);
var m = Math.floor((secs / 3600) % 1 * 60); // Reminder of an hour of seconds x 60
var s = Math.floor((secs / 60) % 1 * 60); // Reminder of a minute of seconds x 60
return pad(h) +":"+ pad(m) +":"+ pad(s);
};
var timers = [];
var socket = io.connect('http://xxx.rhcloud.com:8000/',{'forceNew':true });
socket.on('stream', function (data) {
$.each(data.streamArray,function(index,auction){
duration = auction.duration;
num_rows = data.streamArray.length;
if (duration > 0)
{
var price_retail = $("#" + auction.id).attr("data-retail");
var calc = auction.price.toFixed(2);
var price_calc = calc.toString().replace(/\./g, ',');
$(".price" + auction.id).html(price_calc + "€");
$(".discount" + auction.id).html(discount + "%");
if (timers.length < num_rows)
timers.push([auction.id, auction.duration]);
for(i in timers)
{
if ($('.price' + timers[i][0]).data('curr_text') !== $('.price' + timers[i][0]).text())
{
$(".flashing" + timers[i][0]).toggle("highlight").toggle("highlight");
timers[i][1] = auction.duration;
}
}
$('.price' + auction.id).data('curr_text', $('.price' + auction.id).text());
}
else
{
$(".sold" + auction.id).html("<div class='sold'>SOLD</div>").fadeOut('fast').fadeIn('fast');
}
});
});
function timerCount() {
for(i in timers) {
if(timers[i][1] <= 0) {
delete timers[i]; // if timer seconds is less than 1, delete it.
} else {
timers[i][1]--; // else, decrease it by 1 second.
duration_html = formatSeconds(timers[i][1]);
$(".duration" + timers[i][0]).html(duration_html);
}
}
}
setInterval(timerCount, 1000);
还必须提及的是,如果拍卖实际上已经结束,则会出现一个名为“ SOLD”的红色标志(请参阅套接字流的末尾)。 但这也没有发生。 计时器刚刚停止,然后转到00:00:00
。 因此,它与delete timers[i]
触发得太早的数组有关系,我猜呢?
附加信息:我忘了提到这些计时器重置为大约。 每次用户出价15-16秒。 因此,数组timers
可以存活很长时间。 这个数组每秒循环一次。
据我了解,您的计时器每1分钟被以下代码删除:
function timerCount() {
for(i in timers) {
if(timers[i][1] <= 0) {
delete timers[i]; // if timer seconds is less than 1, delete it.
} else {
timers[i][1]--; // else, decrease it by 1 second.
duration_html = formatSeconds(timers[i][1]);
$(".duration" + timers[i][0]).html(duration_html);
}
}
}
您在哪里减少几分钟和几小时?
第二件事-您不能保证客户端和服务器上的时间是同步的,因此您应该对计时器中的时间执行一些AJAX请求,并以一定的间隔调整计时器。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.