重新切换/重新添加jQuery中变量的类

Question

我正在为音频播放器开发一个主控制面板，一切正常，但如果我在播放一个音轨的同时播放另一首曲目，然后在主控件上按一下Stop，然后在主控件上再按一次播放，则不会添加类“ .pause”回到正轨。 JsFiddle： http : //jsfiddle.net/jeffd/2fjnmdkb/15/

    $(".play").on('click', function () {
     var key = $(this).attr('key');
     var nowplay = $(this); // variable for now playing class .play
     EvalSound(this, key);
     $(".play").not(this).removeClass("pause");     
     $(this).toggleClass("pause");
     $(this).hasClass("pause") ? $(".playerbottom").addClass("pausebottom") : $(".playerbottom").removeClass("pausebottom");
 $(".playerbottom").on('click', function () {
   nowplay.toggleClass("pause");   
$(".play").not(nowplay).removeClass("pause");

 }); 

});
 var thissound = new Audio();
 var currentKey;
 function EvalSound(el, key) {
     thissound.addEventListener('ended', function () {
         // done playing
         $(el).removeClass("pause");
         $(".playerbottom").removeClass("pausebottom");
     });
     if (currentKey !== key) thissound.src = "http://99centbeats.com/1e4cb5f584d055a0992385c1b2155786/" + key;
     currentKey = key;
     if (thissound.paused) thissound.play();
     else thissound.pause();
     currentPlayer = thissound;
 }

$(".volume_slider").slider({
    value  : 75,
    step   : 1,
    range  : 'min',
    min    : 0,
    max    : 100,
    slide  : function(){
        var value = $(".volume_slider").slider("value");
        thissound.volume = (value / 100);
    }
}); 
 $(".playerbottom").on('click', function () {
     $(this).toggleClass("pausebottom");
     if (thissound.paused) thissound.play();
     else thissound.pause();

 });

Answer 1

在将nowplay设为全局变量后，它可以工作：window.nowplay = $（this）;

工作解决方案： http : //jsfiddle.net/jeffd/2gbz7agp/

    $(".play").on('click', function () {
     var key = $(this).attr('key');
     window.nowplay = $(this); // variable for now playing class .play
     EvalSound(this, key);
     $(".play").not(this).removeClass("pause");     
     $(this).toggleClass("pause");
     $(this).hasClass("pause") ? $(".playerbottom").addClass("pausebottom") : $(".playerbottom").removeClass("pausebottom");
 $(".playerbottom").on('click', function () {
      $(this).hasClass("pausebottom") ? nowplay.addClass("pause") : nowplay.removeClass("pause");

 }); 

});
 var thissound = new Audio();
 var currentKey;
 function EvalSound(el, key) {
     thissound.addEventListener('ended', function () {
         // done playing
         $(el).removeClass("pause");
         $(".playerbottom").removeClass("pausebottom");
     });
     if (currentKey !== key) thissound.src = "http://99centbeats.com/1e4cb5f584d055a0992385c1b2155786/" + key;
     currentKey = key;
     if (thissound.paused) thissound.play();
     else thissound.pause();
     currentPlayer = thissound;
 }

$(".volume_slider").slider({
    value  : 75,
    step   : 1,
    range  : 'min',
    min    : 0,
    max    : 100,
    slide  : function(){
        var value = $(".volume_slider").slider("value");
        thissound.volume = (value / 100);
    }
}); 
 $(".playerbottom").on('click', function () {
     $(this).toggleClass("pausebottom");
     if (thissound.paused) thissound.play();
     else thissound.pause();

 });