关于javascript:如何禁用html5音频元素播放/暂停按钮

 2021-04-27 

How to disable html5 audio element play/pause button

通过html5音频元素中的"播放/暂停"按钮禁用或阻止事件的方式是什么?

我正在尝试这样的事情:

1
2
3
document.getElementById(id).addEventListener("pause", function() {
    $(this).trigger("play");
});

这是一个单独的作品,但是我的问题是我想在单击音频元素所在的div时控制播放/暂停:

1
2
        <source src="my_song.mp3" type="audio/mpeg">
    </audio>
1
2
3
4
5
6
7
8
9
10
var is_playing;
$("#my_div").click(function () {
    if (is_playing) {
        $('#my_audio').trigger("pause");
        is_playing = false;
    } else {
        $('#my_audio').trigger("play");
        is_playing = true;
    }
});

因此当我使用音频元素的暂停/播放按钮时,这会导致冲突。因此,我正在寻找一种方法来防止发生播放/暂停音频元素控件的事件(而不是整个控件,因为我需要使用搜寻栏和音量)。


playpause不是jQuery方法。尝试在元素

上调用.play().pause()

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(function() {
  var is_playing;
  $("#my_div").click(function(e) {
    // if `e.target` is not `` element
    if(e.target.tagName !=="AUDIO") {
      if (is_playing) {
        $('#my_audio')[0].pause();
        is_playing = false;
      } else {
        $('#my_audio')[0].play();
        is_playing = true;
      }
    } else {
      e.stopPropagtion()
    }
  });
});

plnkr http://plnkr.co/edit/l5NejZ4rvxTZLPghkFWF?p=preview