我想播放以下代码中指定的区域;不是整个 mp3 文件。这对我目前正在进行的项目很有用;我建立一个电子商务商店。我希望客户仅在购买之前流式传输该部分。
//Draws the waveform
var wavesurfer = WaveSurfer.create({
container : '#waveform',
barWidth : 3,
barHeight : 2,
fillParent : true,
hideScrollbar : true,
responsive : true,
height : 50,
waveColor : '#cccccc',
progressColor : '#666666',
cursorColor : 'white',
cursorWidth : 2,
//Creates the region I want to play
plugins: [
WaveSurfer.regions.create({
regions: [
{
start: 60,
end: 80,
loop: false,
color: '#cccccc'
}
]
})
]
});
//Play and pause buttons
wavesurfer.on('play', function () {
document.getElementById("playButton").innerHTML = "<i class='material-icons'>pause</i>";
});
wavesurfer.on('pause', function () {
document.getElementById("playButton").innerHTML = "<i class='material-icons'>play_arrow</i>";
});
//Play and pause function
function togglePlay()
{
if(wavesurfer.isPlaying())
wavesurfer.pause();
else
wavesurfer.play();
}
//Adds the audio file
var myElement = document.getElementById('my-element');
var myVar = myElement.dataset.myVar;
wavesurfer.load(myVar);
//Hides preloader when waveform is drawn and display the length (duration of the song)
wavesurfer.on('ready', function () {
document.getElementById("preloader-cover").style.display = "none";
var getDuration = wavesurfer.getDuration();
var min = parseInt(getDuration / 60);
var sec = (getDuration % 60).toFixed(0);
var duration = min+":"+sec;
document.getElementById("length").innerHTML = duration;
});