模块代码之rank打分评星级

实现效果如下：

HTML 结构如下：

<ul class="rank">
    <li>
        <label>服务态度</label>
        <dl>
            <dd class="selected"></dd>
            <dd></dd>
            <dd></dd>
            <dd></dd>
            <dd></dd>
        </dl>
    </li>
</ul>

主要CSS如下：

.rank dl dd {
    display: inline-block; width: 30px; height: 30px; margin-right: 10px; background: url(../imgs/sf51.jpg) no-repeat;
}
.rank dl dd.selected {
    background: url(../imgs/sf50.jpg);
}

JS如下:

$(‘.rank dd‘).click(function(){    $(this).addClass("selected");     $(this).prevAll().addClass("selected");    $(this).nextAll().removeClass(‘selected‘);});$(‘.rank dd‘).dblclick(function(){    $("dd").removeClass(‘selected‘);});