【问题标题】:Time function, find a better solution时间函数,找到更好的解决方案
【发布时间】:2013-02-05 10:04:43
【问题描述】:

我用一堆 if else 语句制作了这个时间和日期函数。但是有没有更好的方法来做到这一点?我认为它使用了大量的处理器能力。

函数增加时间。每个数字都是一个 var。所以以秒为单位,我们有单秒 (sec) 和数十秒 (tense)。

在这里查看 jsfiddle:http://jsfiddle.net/MLgbs/1/

$seconds = $('.seconds .one');
$tenseconds = $('.seconds .ten');
$minutes = $('.minutes .one');
$tenminutes = $('.minutes .ten');
$hours = $('.hours .one');
$tenhours = $('.hours .ten');
$days = $('.days .one');
$tendays = $('.days .ten');
$months = $('.months .one');
$tenmonths = $('.months .ten');
$years = $('.years .one');
$tenyears = $('.years .ten');
$houndredyears = $('.years .houndred');

var sec = 0;
var tensec = 0;
var min = 0;
var tenmin = 0;
var hours = 0;
var tenhours = 0;
var days = 0;
var tendays = 0;
var months = 0;
var tenmonths = 0;
var years = 0;
var tenyears = 0;
var houndredyears = 0;


function clock(){
    //Seconds
    if(sec < 9){
        sec++;
        console.log($seconds, sec);
    } else {
        sec = 0;
        console.log($seconds, sec);
        //Tenseconds
        if(tensec<5){
            tensec++;
            console.log($tenseconds, tensec);
        } else {
            tensec = 0;
            console.log($tenseconds, tensec);

            //minutes
            if(min<9){
                min++;
                console.log($minutes, min);
            } else {
                min = 0;

                console.log($minutes, min);
                //tenminutes
                if(tenmin<5){
                    tenmin++;

                    console.log($tenminutes, tenmin);
                } else {
                    tenmin=0;

                    console.log($tenminutes, tenmin);
                    //hours
                    if(hours<9 && (tenhours*10+hours<23)){
                        hours++;

                        console.log($hours, hours);
                    } else {
                        hours=0;

                        console.log($hours, hours);
                        //tenhours
                        if(tenhours<2 && (tenhours*10+hours<23)){
                            tenhours++;
                            console.log($tenhours, tenhours);
                        } else {
                            tenhours=0;
                            console.log($tenhours, tenhours);
                            if(days < 9 && (tendays*10+days<30)){
                                days++;
                                console.log($days, days);
                            } else {
                                if(days !== 0){
                                    days = 0;
                                    console.log($days, days);
                                }
                                if(tendays<2){
                                    tendays++;
                                    console.log($tendays, tendays);
                                } else {
                                    tendays = 0;
                                    console.log($tendays, tendays);
                                    if(months<9 && (tenmonths*10+months<11)){
                                        months++;
                                        console.log($months, months);
                                    } else {
                                        months = 0;
                                        console.log($months, months);
                                        if(tenmonths<0){
                                            tenmonths++;
                                            console.log($tenmonths, tenmonths);
                                        } else {
                                            tenmonths = 0;
                                            console.log($tenmonths, tenmonths);
                                            if(years < 9){
                                                years++;
                                                console.log($years, years);
                                            } else {
                                                years = 0;
                                                console.log($years, years);
                                                if(tenyears<9){
                                                    tenyears++;
                                                    console.log($tenyears, tenyears);
                                                } else {
                                                    tenyears = 0;
                                                    console.log($tenyears, tenyears);
                                                    if(houndredyears<9){
                                                        houndredyears++;
                                                        console.log($houndredyears, houndredyears);
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }

    }
}
setInterval(function(){clock();},1000);

【问题讨论】:

  • setInterval 不可靠。使用Date 对象!

标签: javascript jquery performance time


【解决方案1】:

为什么不直接使用Date() 对象呢?而不是所有这些计算,只需定期从其中提取时间(例如每秒几次),然后显示 - 这样,它将与客户端计算机上的时间同步,而不是不准确的 setInterval 函数,这可能无法准确反映很长时间后的时间(尤其是考虑到您在十几个嵌套条件下所做的所有跑腿工作!)

如果您有多个用户都需要参考公共时钟,请改用 PHP 获取日期 - 这将返回服务器日期/时钟,而不是客户端。

【讨论】:

  • 这很好。但是我不是必须检查每个数字,并在它们发生变化时记录下来吗?事情是。当数字改变时会触发动画。 'console.log(selector, int);'应该是 'animate(selector, int);'
  • 你在制作什么动画?没有看到更多代码很难说,但如果元素的位置由它们的值决定,你可以调用动画函数——如果值没有改变,它不会动画——这样可以节省你的堆积条件。这行得通吗?
  • 我正在制作一个翻转时钟的动画。但是动画功能只是添加和删除类,动画本身是用css完成的。这能回答你的问题吗?
  • 我想我明白你的意思了 - 仍然,而不是很多条件,你可以将时钟值存储在一个对象中,从服务器/日期对象更新,然后遍历它,看看是否有改变了。如果他们有,那么您就有一个字符串键,可以引用所需的动画/类。这有意义吗?
  • 好的,很酷,接下来几天我没有时间,但是当我回到伦敦时,我会检查这个问题,如果没有解决,我会好好寻找你……
猜你喜欢
  • 2014-07-20
  • 2022-01-18
  • 1970-01-01
  • 1970-01-01
  • 2014-08-15
  • 1970-01-01
  • 1970-01-01
  • 2013-01-09
  • 1970-01-01
相关资源
最近更新 更多