Jquery 更改图标图像的CSS代码

我将下面的代码设置为导航按钮的图标图像。当按钮激活以插入另一个图标图像时，如何更改此代码？我正在使用jquerymobile。谢谢

.nav-glyphish-example .ui-btn .ui-btn-inner {
 padding-top: 40px !important; 
}
.nav-glyphish-example .ui-btn .ui-icon { 
width: 30px!important; 
height: 30px!important; 
margin-left: -15px !important; 
box-shadow: none!important; 
-moz-box-shadow: none!important;
-webkit-box-shadow: none!important;
-webkit-border-radius: 0 !important; border-radius: 0 !important; 
}

#home .ui-icon { 
background:  url(glyphish/icons/icons-gray/983-calendarblue@2x.png) 50% 50% no-repeat; 
background-size: 24px 22px; 
}

---

您可以通过javascript动态更改css。
下面的代码为与选择器

#home.ui图标

匹配的元素的

mousedown

事件添加了一个函数。因此，您可以在mousedown事件中更改Backround图像

jquery

---

将

新url

替换为您自己的url（如glyphish/icons/icons gray/983-calendarblue@2x.png）。

我不知道你说的“活动”是什么意思，但是，看一下选择器

给这个答案添加一些解释，我可以给它一个+1。你不能用CSS完成同样的事情吗？@jawad这就是我想要的答案。我希望能够做到这一点，只是使用直CSS@Steven：如果OP没有混淆“活动”和“活动”（如在给HTML元素的活动类中，通常是ul中的“li”或“a（锚定）”，主要用于导航以显示“当前”页面）和“活动”（如在伪类中），它可以很好地通过纯CSS实现，也可以通过多种方法实现，从改变背景图像到改变列表样式图像，无需使用JS或JQ。在任何情况下，OP提供的CSS都不清楚，也没有提供HTML代码。@史蒂文：请先弄清楚您要引用的是哪个“活动”。同样，HTML标记将决定方法。

$('#home .ui-icon').mousedown(function(){
  $(this).css('background-image','url(newurl)');
});

#home .ui-icon { 
background:  url(normal.png) 50% 50% no-repeat; 
}
#home .ui-icon:active { 
background:  url(active.png) 50% 50% no-repeat; 
}
#home .ui-icon:hover { 
background:  url(hover.png) 50% 50% no-repeat; 
}