javascript - 在按钮之间切换 - 图像无法显示

标签 javascript jquery css html

我希望按钮的图像背景在用户单击时发生变化。 我制作了一个包含不同属性的类,以根据它们的类在图像之间切换。 我使用这种方法:

HTML:

     <span id="play"></span>

JS:

    $(document).ready(function(){
    $('#play').click(function(){

    $(this).toggleClass("#pause");
    });
    });

CSS:

    #play
    {
   width:100px;
   height:60px;
   background-image: url('18.jpg');
   float:left;
    }
   #pause
   {
  width:100px;
  height:60px;
  background-image: url('19.jpg');
  float:left;
   }

但是我点击按钮之前和之后根本不显示图片,你知道为什么吗?

谢谢

最佳答案

# 用于表示 id,但您正在切换一个类。试试这个:

$('#play').click(function(){
    $(this).toggleClass("pause");
});
.pause {
    width:100px;
    height:60px;
    background-image: url('19.jpg');
    float:left;
}

关于javascript - 在按钮之间切换 - 图像无法显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10703756/

相关文章:

javascript 如何在鼠标悬停在输入文本框上时显示文本?

Javascript 不在 Github 上执行

javascript - 数组切片返回 [object Object] 而不是值

javascript - 从 Cesium Display 加载和卸载 GeoJSON

html - Youtube Iframe 嵌入代码不适用于 IE/Edge

css - 不能做最大宽度

c# - 如何使 beforeunload 事件仅在浏览器 session 退出时触发

javascript - 如何在剪刀石头布游戏中创建记分牌

jQuery - 停止函数

html - 如何使在 Web 应用程序上创建的 div 出现在父容器的左上角?