Javascript 在指定时间浏览JSON对象（例如电影字幕）

首先，如果标题不够精确，请道歉，如果有人提出建议，我们将非常欢迎。我现在就解释我的问题。我有一个JSON文件（虽然这里是一个javascript对象），我想循环使用它。这是一个电影的字幕文件，我希望能像你期望的那样精确地显示文本：只在指定的时间显示

我没有使用视频播放器或任何其他与此相关的东西，因此只有nodejs在浏览此文件。我知道如何用一个简单的for循环遍历它，但我想知道如何遍历它&在相应的javascript对象中指定的时间执行

 { id: '54',
    startTime: '00:03:46,572',
    endTime: '00:03:53,160',
    text: 'Hello this is a text' 
 },
 { id: '55',
    startTime: '00:03:53,160',
    endTime: '00:03:58,799',
    text: 'To be precise, the subtitle file of a movie' 
 },

---

我能想到一个解决办法-

使用对象数组，为

startTime

和

endTime

之间的时间差设置超时

完成时差后，将拾取下一个对象进行处理或显示（基本上是您的目的）

---

注意时差和代码中的细节。但是，这可以用于逻辑。

首先，必须将

startTime

和

endTime

解析为毫秒

您可以使用

：

和

，

字符来中断字符串，并计算它所代表的毫秒数

function parseTime(t) {
    var segments = t.split(':');
    var ms = parseInt(segments[2].split(',')[1]);
    var h = parseInt(segments[0]);
    var m = parseInt(segments[1]);
    var s = parseInt(segments[2]);
    return h * 60 * 60 * 1000 + m * 60 * 1000 + s * 1000 + ms;
}

接下来，检查数组，并将时间转换为毫秒：

function convertToMs(arr) {
    for (var i = 0; i < arr.length; i++) {
        arr[i].startTime = parseTime(arr[i].startTime);
        arr[i].endTime= parseTime(arr[i].endTime);    
    }
    return arr;
}

现在使用数组：

var subtitles = [{
        id: '54',
        startTime: '00:03:46,572',
        endTime: '00:03:53,160',
        text: 'Hello this is a text' 
    },
    { 
        id: '55',
        startTime: '00:03:53,160',
        endTime: '00:03:58,799',
        text: 'To be precise, the subtitle file of a movie' 
    }];
subtitles = convertToMs(subtitles);
showSubtitles(subtitles, 0);

---

这是一把工作小提琴，字幕时间更短：

这是一个很好的答案，非常感谢。有了这个答案，是否有可能暂停字幕的播放并再次继续？（我知道这不是我最初的问题，但我想知道我如何才能使它适合这个解决方案）如果你想让它像一个真正的副标题一样“表演”，那么我可以肯定。我已经更新了答案，以便在字幕“消失”时清除控制台。还为小提琴添加了一个更新，在一个div中显示。哦，我不是那个意思。我想有一个按钮，可以暂停浏览字幕文件，然后在它停止时恢复。但我不确定我如何才能实现这一点，或者这将有多困难。不是那么困难

setTimeout

返回一个句柄，稍后可与

clearTimeout

一起使用该句柄中止未来的函数调用。因此，您可以只保留下一次

setTimeout

调用的当前句柄和当前

i

值，如果按下按钮，则使用

clearTimeout

中止，并在恢复时从

i

开始。问题是你需要调整时间，当然，这是可能的，只是需要更多的思考（也许保持时间流逝，并用它来操纵时间）

function showSubtitles(arr, i) {
    setTimeout(function() {
        console.log(arr[i].text);
        setTimeout(console.clear, arr[i].endTime - arr[i].startTime); // Make the subtitle "disappear"
        i++;
        if (arr.length > i) {
            showSubtitles(arr, i);
        }
    }, i == 0 ? (arr[i].startTime) : (arr[i].startTime - arr[i-1].startTime));
}

var subtitles = [{
        id: '54',
        startTime: '00:03:46,572',
        endTime: '00:03:53,160',
        text: 'Hello this is a text' 
    },
    { 
        id: '55',
        startTime: '00:03:53,160',
        endTime: '00:03:58,799',
        text: 'To be precise, the subtitle file of a movie' 
    }];
subtitles = convertToMs(subtitles);
showSubtitles(subtitles, 0);