小编Mor*_*rri的帖子

如何突出显示音频文件的转录内容?

我是 javascript 初学者,所以我很抱歉我的业余代码。我有一个音频和一些作为它的字幕的文本。我有对话的时间戳。例如,音频中“hi”的时间戳是“1.525487”秒。我想在那一刻突出显示文本“嗨”。

当我使用整数作为“span id”(例如“ts1”)时,它可以正常工作,但是当我使用“1.525487”等十进制数时,它不起作用。我该怎么办?

感谢您的帮助。

<body>
<audio id = "adi" controls>
<source src="Greeting.mp3"></source>
</audio>

<div>
<pre>
A: <span id="ts1.525487">Hi</span> , <span id="ts2.193877">how are you doing?</span>
</pre>
</div>

<script>
var spns = document.getElementsByTagName("SPAN");
var audi = document.getElementById("adi");

audi.addEventListener("timeupdate", f1);
function f1(){
    var i;
    for (i = 0 ; i< spns.length ; i++){
        if(spns[i].id == "ts" + audi.currentTime){
            spns[i].style.backgroundColor = "red";  
        }
    }
}
</script>
</body>
Run Code Online (Sandbox Code Playgroud)

javascript audio highlight

4
推荐指数
1
解决办法
1430
查看次数

标签 统计

audio ×1

highlight ×1

javascript ×1