Question

我尝试为我的网站上的预告片做一个计时器，它完美无缺。在140毫秒后，它显示工作2，即工作1，在410之后，然后是工作3，工作4，依此类推。

现在我想把每个作品的时间都显示在我的“作品”对象中，让js为我添加它们。

但正如我从我的想法开始（在“问题部分”下），我遇到了第一个问题。如果我将140毫秒作为数字插入第一个时间帧，为什么一切正常呢？但如果我用var tt_1替换它？

我用警报检查了它，它包含正确的值。那么js计算值的方式有什么棘手的吗？我错了什么？提前谢谢！

PS：并不是它会引发任何错误，但它需要比预见的140毫秒多10倍的时间

var works = { 
  1: { …, tt: 210 },
  2: { …, tt: 190 },
  3: { …, tt: 140 },
  4: { …, tt: 90 }, 
  5: { …, tt: 100 },
  //…
};

// works in trailer
var trailer = [3,1,4,2,…]

//time line trailer PROBLEMATIC PART
var tw_1 = trailer[0];
var tt_1 = works[tw_1]['tt'];   // ->140
alert(tt_1)                     // alerts correctly 140

var timeFrames = {
  **tt_1**: trailer[1],            // works if 140 inserted here but not with tt_1
  410:  trailer[2],
  590:  trailer[3],
}; 
var maxStep = 680;

<!--optional variables end-->

var timer;
var timerPaused = false;
var stepSize = 100;
var currentStep = 0;

var intervalTimer = function() {

  if ( !timerPaused ) { currentStep ++; }
  if ( !!timeFrames[currentStep] ) {
    //do something each timer step  
}
  if ( currentStep >= maxStep ) {
    //do something at the end       
    timer = window.clearInterval(timer);   
    currentStep = 0;
  }
}

感谢sabithpocker的解决方案，我成功地创建了以下代码，该代码工作正常并让我独立于预告片长度：

var timeFrames = {};
var currentWork = trailer[0];
var time = 0;

for ( var i = 1; i < trailer.length; i++ ) {    
  var previousWork = trailer[i-1];  
  var currentWork = trailer[i]; 
  var addTime = works[previousWork]['time'];
  time = time + addTime;
  timeFrames[time] = currentWork;
};

Answer 1

var timeFrames = {}; 

timeFrames[tty_1] = trailer[1]; //timeFrames["140"] = trailer[1]

另一方面，你会得到

timeFrames = {tty_1 : "value of trailer[1]"}

OP在评论中发布的最终代码：

var first = trailer[0];
var second = trailer[1];
var third = trailer[2];
var fourth = trailer[3];
var timeFirst = works[first]['time'];
var timeSecond = timeFirst + works[second]['time'];
var timeThird = timeSecond + works[third]['time'];
var timeMax = timeThird + 90; //automatic trailer show timer //time line trailer fades 
var timeFrames = {};
timeFrames[timeFirst] = second;
timeFrames[timeSecond] = third;
timeFrames[timeThird] = fourth;
var maxStep = timeMax;

灵活的javascript计时器

1 个答案: