音频视频html5中如何处理源不存在?

时间:2017-09-26 09:30:51

标签: javascript jquery html5 onerror

如何处理音频视频html5中不存在的来源?

我试过https://www.w3schools.com/TAgs/av_event_error.asp: 纯javascript

<audio controls onerror="alert(1);">
  <source src="http://somethingthatnotexist" type="audio/mpeg">
</audio>

使用jquery

<audio controls ">
  <source src="http://somethingthatnotexist" type="audio/mpeg">
</audio>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script>
    $(function(){
        $('audio').on('error', function(){
            alert(1);
        })
    });
</script>

但尚未解决。

正确的方法是将src标记内的<video>放置在<source>标记内。像这样: 适用于javascript和jquery

<audio id="myaudio" controls src="http://somethingthatnotexist"></audio>

但这对我来说很尴尬,因为:

  1. 我需要向我的客户提供超过1个音频

  2. 那么多使用<audio><source src=""></source></audio>而不是<audio src=""></audio>

  3. 的播放器插件/库

    感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

试试这个

<audio controls>
  <source id="my_audio" src="http://somethingthatnotexist" type="audio/mpeg">
</audio>

$("#my_audio").on("error", function (e) {
  alert("Error with source file!");
});

答案 1 :(得分:0)

这是一种更简单和常见的方式:

<audio controls>
  <source src="http://somethingthatnotexist" type="audio/mpeg">
  Error with source file!
</audio>

如果由于某种原因无法播放音频文件,则会显示包含的文本。 (不是警报,而是播放器GUI)

相关问题