2013-04-22 142 views
0

可以说我有这种格式的电视节目的开始时间和持续时间:10:05
我想要做的是当某人输入程序数据并输入程序的开始时间和持续时间时,我的代码将它们加在一起并自动填充下一个程序的开始时间。使用JavaScript处理格式化时间

我试图将这些时间转换为秒,然后操作后再次将它们转换为格式化时间,但我不知道该怎么做。

function processTime(time) {  
    if (typeof time !== 'undefined') { 
     var times = time.split(":"); 
     var minutes = times[0]; 
     var seconds = times[1]; 
     seconds = parseInt(seconds, 10) + (parseInt(minutes, 10) * 60); 
    } else { 
     var seconds = null; 
    } 
    return seconds; 
} 

function createTime(timestamp) { 
    var output; 
    if (typeof timestamp !== 'undefined') { 
     // Problem is here, my timestamp is not standard unix timestamp 
     var time = new Date(timestamp * 1000); 
     var minutes = time.getMinutes(); 
     var seconds = time.getSeconds(); 
     output = minutes + ":" + seconds; 
    } 
    return output; 
} 

$progForm.delegate(".program-duration", 'keyup', function() { 
     $(this).on('focusout', function() { 
      var duration = processTime($(this).val()); 
      var startTime = processTime($(this).parent().prev().find(".program-time").val()); 
      if (duration && typeof duration !== 'undefined' && startTime && typeof startTime !== 'undefined') { 
       var nextStart = duration + startTime; 
       var $nextProgramTime = $(this).parent().parent().next().find(".program-time"); 
       if (parseInt($nextProgramTime.val()) < 1) { 
        $nextProgramTime.val(createTime(nextStart)); 
       } 
      } 
     }); 
    }); 


<form> 
    <table> 
     <tbody class="programs-inputs"> 
      <tr> 
       <td><input type="text" class="program-time timepicker input-mini" name="programs[time][]" placeholder="00:00" /></td> 
       <td><input type="text" class="program-duration timepicker input-mini" name="programs[duration][]" placeholder="00:00" /></td> 
      </tr> 
      <tr> 
       <td><input type="text" class="program-time timepicker input-mini" name="programs[time][]" placeholder="00:00" /></td> 
       <td><input type="text" class="program-duration timepicker input-mini" name="programs[duration][]" placeholder="00:00" /></td> 
      </tr> 
     </tbody> 
    </table> 
</form> 
+0

您可以显示您的尝试? – 2013-04-22 21:47:50

+0

@Kolink在这里。 – 2013-04-22 21:52:22

+0

你有没有日期(不仅是时间)? – Bergi 2013-04-22 21:52:33

回答

1

只要用你的processTime算法的逆:

function createTime(timestamp) { 
    if (typeof timestamp == 'number') { 
     var seconds = timestamp % 60; 
     var minutes = (timestamp - seconds)/60; 
     return ("0"+minutes).slice(-2) + ":" + ("0"+seconds).slice(-2); 
    } 
} 

你原来的尝试是正确的方式,只是它没有时区防。虽然new Date(timestamp * 1000);构建从1970年1月1日00:00:00 UTC 毫秒的值,则getMinutes()getSeconds()方法将返回值在当前,当地时区是标记 - 它可以是一个半小时了。切换到他们的UTC当量(.getUTCMinutes(),.getUTCSeconds()),它会工作。与Date objects一起使用解决方案将为您节省很多麻烦,一旦您需要包括小时,甚至可能包含完整的日期:-)

1

Unix时间戳显示既然你是只关心时间,没有日期,UNIX时间戳,因为新的一年1970年的时候可能是不适合的。你可以做与你以前做的相反的事。

var seconds = totalSeconds; 
var hours = Math.floor(seconds/3600); 
seconds -= hours * 3600; 
var minutes = Math.floor(seconds/60); 
seconds -= minutes * 60; 

var timeString = leadingZero(hours) + ':' + leadingZero(minutes) + ':' + leadingZero(seconds); 

这不会给你带领零,但应该很容易解决。

function leadingZero(num) { 
    var str = ''; 
    if (num < 10) { 
     str += '0'; 
    } 
    return str + num; 
} 
+0

你知道如何为小于10的数字添加前导零? – 2013-04-22 22:01:51

+1

更新了答案以表示前导零。不是很漂亮,但它解决了问题:)。 – Reason 2013-04-22 22:06:03

+0

谢谢,我想也许有JavaScript中的函数来改变这种数字的格式。 – 2013-04-22 22:06:40