1

我已经编写了一些 JavaScript,它们基本上使不同的像素可见,具体取决于时间。我已经编写了代码(至少几秒钟),它工作正常,但我在简化它时遇到了麻烦,所以我不必一遍又一遍地输入(几乎)相同的代码。

这是我的代码示例:

    var getTime = function() {
            var date = new Date();
            var hours = date.getHours();
            var mins = date.getMinutes();
            var secs = date.getSeconds();

            if (secs==0) {
                for (var s=1; s < 60; s++) {
                    $("#s" + s).removeClass('display');
                };
            } else if (secs == 1) {
                for (var s=1; s < (secs+1); s++) {
                    $("#s" + s).addClass('display');
                };
            } else if (secs == 2) {
                for (var s=1; s < (secs+1); s++) {
                    $("#s" + s).addClass('display');
                };
            } else if (secs == 3) {
                for (var s=1; s < (secs+1); s++) {
                    $("#s" + s).addClass('display');
                };
            .........(cont.)
            } else if (secs == 59) {
                for (var s=1; s < (secs+1); s++) {
                    $("#s" + s).addClass('display');
                }
            }
        };
4

4 回答 4

3

如果我理解正确,您正在尝试#s根据秒数显示。简单的解决方案是清除所有并重新设置显示。

var getTime = function() {
   var date = new Date();
   var hours = date.getHours();
   var mins = date.getMinutes();
   var secs = date.getSeconds();

   //Hide all ids starting with 's'
   $('[id^=s]').removeClass('display');

   for (var s=1; s < (secs+1); s++) {
       $("#s" + s).addClass('display');
   }
};
于 2013-06-28T14:17:10.787 回答
1

(更新以确保即使我们错过了一个勾号,行为也是正确的)

var getTime = function() {
    var date = new Date();
    var hours = date.getHours();
    var mins = date.getMinutes();
    var secs = date.getSeconds();

    for (var s = 0; s < 60; s++) {
      var elements = $("#s" + s);
      elements.removeClass('display');
      if (s <= secs) {
          elements.addClass('display');
      }
    }
}
于 2013-06-28T14:04:08.810 回答
0

我可能会遗漏一些东西,因为不明白为什么你有 59 个else看起来相同的条件

var getTime = function() {
    var date = new Date();
    var hours = date.getHours();
    var mins = date.getMinutes();
    var secs = date.getSeconds();

    if (secs==0)
        for (var s=1; s < 60; s++)
            $("#s" + s).removeClass('display');
    else
        for (var s=1; s < (secs+1); s++)
            $("#s" + s).addClass('display');
};
于 2013-06-28T14:05:25.640 回答
0

对于超过 0 的秒数,您的逻辑始终相同

if (secs < 1) {

    for (var s=1; s < 60; s++) {
        $("#s" + s).removeClass('display');
    };


} else {

    for (var s=1; s < (secs+1); s++) {
        $("#s" + s).addClass('display');
    };


}
于 2013-06-28T14:05:26.200 回答