gpt4 book ai didi

javascript - 如何在网页上单击鼠标或鼠标悬停时播放音频文件的一部分?

转载 作者:行者123 更新时间:2023-11-27 22:40:46 31 4
gpt4 key购买 nike

我正在创建一个用于教授一些阿拉伯语单词的网站。我包括数字、序号、星期几等,我有一个包含所有这些的音频文件,我想用鼠标悬停或鼠标单击来播放它。现在,我不想将音频剪切成许多片段来完成这项工作。有没有办法在鼠标点击或鼠标悬停时调用音频文件并且只播放部分文件?例如,我有一个音频文件,其中包含从 1 到 10 的数字,假设每个文件的长度为一秒。当用户点击数字 5 时,我希望能够调用数字音频文件并播放第 5 秒并停止。这可能吗?以下是我调用和播放整个音频的代码。谢谢!

<!DOCTYPE html>
<html>
<head>
<title>Arabic Letters</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<script language="javascript" type="text/javascript">
function playSound(soundfile) {
document.getElementById("dummy").innerHTML=
"<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
}
</script>

</head>

<body>
<span id="dummy"></span>

<a href="#" onclick="playSound('1-001_page3.mp3');"><p dir="rtl" lang="ar"
class="letter">واحِد</p></a>

</body>
</html>

最佳答案

我会使用一个全局变量来设置当前停止点并绑定(bind)一个 timeupdate 监听器来检查时间是否已到:

var endTime = 0;
// do this binding once at page load time
myaudio.addEventListener("timeupdate", function() {
if(this.currentTime >= endTime) {
this.pause();
}
});

对于每个事件,使用 myaudio.currentTime 设置开始时间,使用 endTime 设置结束时间和 play() 音频:

// plays the audioObj from start to stop times (in seconds)
// call this for each snippet you wish to play (e.g., in an onclick handler)
function playInterval (audioObj, start, stop) {
audioObj.currentTime = start*1000;
endTime = stop*1000;
audio.play();
}

关于javascript - 如何在网页上单击鼠标或鼠标悬停时播放音频文件的一部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11036036/

31 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com