javascript - myAudio.play() 不是一个函数

标签 javascript jquery html mp3 html5-audio

当我尝试播放音频文件时收到一条奇怪的消息。

在我的 html 上我有一个声音文件:

<audio id="song" src="song.mp3"></audio>

当我点击图像时:

<img onclick="togglePlay()" src="image.png" width="100%">
                    </div>

在我的 JavaScript 上:

  var myAudio = $("#song");

  var isPlaying = false;
  function togglePlay() {
     if (isPlaying) {
          myAudio.pause();
      } else {
        myAudio.play();
      }
   };
   myAudio.onplaying = function() {
      isPlaying = true;
   };
   myAudio.onpause = function() {
      isPlaying = false;
   };

我没有收到任何声音,并且控制台上出现一条警告消息:“myAudio.play() 不是一个函数”。

最佳答案

基于您的问题的示例解决方案:

var myAudio = $("#song")[0];

var isPlaying = false;

function togglePlay() {
    if (isPlaying) {
        myAudio.pause();
    } else {
        myAudio.play();
    }
};
myAudio.onplaying = function() {
    isPlaying = true;
};
myAudio.onpause = function() {
    isPlaying = false;
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<audio id="song" src="https://ia801009.us.archive.org/4/items/BeatlesGreatestHits/02%20With%20a%20Little%20Help%20From%20My%20Friends.mp3"></audio>

<img onclick="togglePlay()" src="https://pmcdeadline2.files.wordpress.com/2014/06/the-beatles-1__140613232022.jpg" width="100%">

如果将来损坏,请检查图像和音频是否有死链接。

关于javascript - myAudio.play() 不是一个函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40353365/

相关文章:

html - FontAwesome : icon-4x no worky

javascript - split方法和数组拼接js

javascript - 使用 jQuery 获取期权值(value)并应用折扣?

jquery - 我如何让 jQuery 选择自定义 HTML 标签

javascript - 选择特定链接后如何在同一位置显示五个视频之一?

php - 无法插入多个数据需要救援

html - Bootstrap 类容器不起作用

javascript - faker一直显示同一张图,如何避免?

javascript - 动态分配事件监听器

javascript - 如何在 jQuery Mobile 中设置宽度为 100% 的输入类型日期