jQuery - 为音频播放器添加最近Div的divClass

时间:2016-04-30 22:31:35

标签: javascript jquery parent html5-audio addclass

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

我正在尝试在播放器播放后向播放器上方的div添加一个类。页面上有多个玩家具有相同的设置,所以不知何故我只想将它应用于上面的第一个div“musicianspan”。

我尝试这样做是在脚本的最后一行使用“最近”。但它不起作用。不知何故,我需要将“glow”类应用于上面的“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>

2 个答案:

答案 0 :(得分:1)

这是否有效(替换你的最后一行)?

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

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

描述:获取匹配元素集中每个元素的前一个兄弟。如果提供了选择器,则仅当它与该选择器匹配时才会检索前一个兄弟。

答案 1 :(得分:1)

你必须将你的this.bbplayer elemet包装在jQuery函数中才能使用它的方法。所以以下内容应该有效:

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