jquery - 单击时更改列表样式图像

Question

我有一个带有一个小加号的 list 图像的列表。这是用于切换列表的 javascript:

$(document).ready(function(){
      $('#main li ul').hide();
      $('#main li').click(function() {
      $(this).children('ul').slideToggle("slow");
      });
});

我希望能够做的是，当我单击其中一个月份时，符号会变为位于 here 的减号。

Here是目前工作列表的 fiddle 的链接。

关于更改图像的最简单方法有什么想法吗？

Answer 1

检查一下:http://jsfiddle.net/RPpgQ/

CSS

#main {
    cursor:pointer;
    padding-left: 20px;
}

#main li {list-style-image: url('http://static.nahoku.com/skin/frontend/enterprise/nahoku/images/plus-icon.gif');}
#main li.open {list-style-image: url('http://avnetexpress.avnet.com/wcsstore/emstore/images/prodnav-minus-sm.gif');}

#main ul {
     list-style-image: none;
}​

JavaScript

$(document).ready(function(){
    $('#main li ul').hide();
    $('#main li').click(function() {
        $(this).children('ul').slideToggle("slow");
        $(this).toggleClass('open');
    });
});
​