Question

我试图在页面上添加一个CREATE TABLE #tmp (no_ int ,NAME varchar(100)) INSERT INTO #tmp ( no_, NAME ) VALUES (1, 'cat') ,(1, 'cat') ,(2, 'dog') ,(2, 'dog') ,(2, 'dg') ,(3, 'rat') DECLARE @vName VARCHAR(500) DECLARE @tblDistinctno table(no_ int ,NAME varchar(500)) INSERT INTO @tblDistinctno SELECT no_ , Name FROM #tmp GROUP BY no_ , Name SELECT no_,SUBSTRING(Name,0,LEN(name)) FROM ( SELECT DISTINCT o.no_ ,Name = STUFF(( SELECT name +',' FROM @tblDistinctno i WHERE o.no_ = i.no_ -- ORDER BY i.no_ FOR XML PATH('')),1,0,'') FROM @tblDistinctno o GROUP BY o.no_ )t DROP TABLE #tmp标签，并且担心音频加载。特别是较长的音频需要（相对）较长的时间才能加载缓慢的互联网。

研究了<audio>个加载事件后，我发现了<audio>和canplay。一旦触发canplaythrough事件，我就可以播放音频了，但是，由于某种原因，即使它可以正常工作，我也无法使其在canplaythrough和canplay事件之间播放

如何在canplaythrough之后但在canplay之前开始播放音频？

我也愿意接受非本地解决方案（第三方JS库）来启用这种分块播放（在完全加载之前播放）。

编辑：事实证明，这仅发生在Safari中，尽管我仍在寻找潜在的解决方案。

（在Safari canplaythrough，Firefox 12.1.2 (14607.3.9)和Chrome 69.0中测试，它们都在macOS 76.0.3809.132上运行）

示例：

10.14.6 (18G87)

输出：

<audio id="audioElement" src="audio.mp3" preload="none" />

<script type="text/javascript">
  document.addEventListener("DOMContentLoaded", () => {
    console.log('document.DOMContentLoaded');

    const audioElement = document.getElementById('audioElement');

    audioElement.addEventListener('canplay', () => {
      console.log('audioElement.canplay');
      audioElement.play();
    });
    audioElement.addEventListener('canplaythrough', () => {
      console.log('audioElement.canplaythrough');
    });

    audioElement.addEventListener('play', () => {
      console.log('audioElement.play');
    });
    audioElement.addEventListener('playing', () => {
      console.log('audioElement.playing');
    });
    audioElement.addEventListener('timeupdate', (e) => {
      console.log('audioElement.timeupdate', audioElement.currentTime);
    });

    console.log('Loading...')
    audioElement.load();
  });
</script>

在Safari中的“ canplaythrough”事件之前播放HTML5 <音频>

0 个答案: