javascript - 如何在音乐暂停时更改按钮背景图像

Question

我正在使用 HTML5 创建一个只有一个按钮的简单音频播放器。默认情况下它是自动播放的，但是如果按下按钮它会暂停，反之亦然。问题是我想在按下按钮时更改按钮的背景图像。

这是我的代码，显然不会改变背景。

var beepTwo = $("#musicBeat");
beepTwo[0].play();

$("#dan").click(function() {  
    if (beepTwo[0].paused == false) {
        beepTwo.animate({volume: 0}, 2000, 'swing', function() {
            // really stop the music 
            beepTwo[0].pause();
            $(this).css("background","url (http://goo.gl/w5EWHg)");
        });
     } else {
         beepTwo[0].play();  
         beepTwo.animate({volume: 1}, 2000);
         $(this).css("background","url (http://goo.gl/0GMoZK)");
     }
});

DEMO

我如何根据按钮状态更改(切换)背景图像。它必须通过淡入淡出效果来改变。

提前致谢

Answer 1

this 在您更改背景时指的是 beepTwo，而不是 #dan。在点击函数的开头添加var self = this，在.css()处将this改为self > 功能。