jQuery

Question

我有一个正在使用的 html5 音频播放器 (http://73rhodes.github.io/bbplayer/)

我正在尝试在播放器播放时将 class 添加到播放器上方的 div。页面上有多个播放器具有相同的设置，所以不知何故我只想将它应用于上面的第一个 div class "musicianspan".

我的尝试是在脚本的最后一行使用 "closest"。但它不起作用。不知何故，我需要将 "glow" class 应用于上面的 "musicianspan" div。有任何想法吗？谢谢！

<!-- Player 1 -->
<div class="musicianspan"></div>

<span class="bbplayer">
<span class="bb-play bb-paused"></span>
<span class="bb-trackLength">03:25</span>
</span>


<!-- Player 2 -->
<div class="musicianspan"></div>

<span class="bbplayer">
<span class="bb-play bb-paused"></span>
<span class="bb-trackLength">03:25</span>
</span>


<!-- Player 3 -->
<div class="musicianspan"></div>

<span class="bbplayer">
<span class="bb-play bb-paused"></span>
<span class="bb-trackLength">03:25</span>
</span>


<script>
  BBPlayer.prototype.updateDisplay = function () {
    var audioElem = this.bbaudio;
    var duration  = toTimeString(Math.ceil(audioElem.duration));
    this.bbplayer.getElementsByClassName('bb-trackLength').item(0).innerHTML = duration;
    if (this.bbaudio.paused) {
      playButton.classList.remove("bb-playing");
      playButton.classList.add("bb-paused");
    } else {
      playButton.classList.remove("bb-paused");
      playButton.classList.add("bb-playing");  
      this.bbplayer.closest('.musicianspan').addClass('glow');
    }
  };
</script>

Answer 1

这行得通吗（替换你的最后一行）？

this.bbplayer.prev().addClass('glow');

https://api.jquery.com/prev/

说明： 获取匹配元素集中每个元素的前一个兄弟元素。如果提供了一个选择器，它只会检索与该选择器匹配的前一个兄弟。

Answer 2

您必须将 this.bbplayer 元素包装在 jQuery 函数中才能使用其方法。所以以下应该有效：

$(this.bbplayer).closest('.musicianspan').addClass('glow');

jQuery - 为音频播放器添加类到最近 Div

jQuery - addClass to Nearest Above Div for Audio Player

javascript

parent

html5-audio

addclass