【问题标题】:How to handle source not exist in audio video html5?如何处理音频视频html5中不存在的源?
【发布时间】:2017-09-26 09:30:51
【问题描述】:

如何处理音频视频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 放在&lt;video&gt; 标记内,而不是放在&lt;source&gt; 标记内。像这样: 适用于 javascript 和 jquery

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

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

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

  2. 使用&lt;audio&gt;&lt;source src=""&gt;&lt;/source&gt;&lt;/audio&gt; 而不是&lt;audio src=""&gt;&lt;/audio&gt; 的播放器插件/库太多

感谢您的帮助。

【问题讨论】:

    标签: javascript jquery html onerror


    【解决方案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!");
    });
    

    【讨论】:

    • 不错。非常感谢您。我会更新我的问题,这样你的答案对于像我一样遇到同样问题的每个人来说都会很清楚
    【解决方案2】:

    一个更简单通用的方法是这样的:

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

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

    【讨论】:

      猜你喜欢
      • 2020-08-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-07-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多