将价值绑定到星级

时间:2013-07-18 08:05:45

标签: jquery asp.net css

我在我的网络应用程序中使用星级评分系统。我在获取星级的先前评级值时遇到问题。如果用户之前已经评级过[4]。它必须通过四星闪烁显示。目前我正在保存用户在数据库中的投票并重新获得费率值。但我不知道如何将评级值绑定为星号。

这是我的代码: CSS

.stars on{background:url(../image/star_on.gif) no-repeat;}
.stars li{
    float:left;
    width:17px;
    height:17px;
   background-image: url( '../image/ratingStarEmpty.gif' );
    list-style-type:none;
    transition:all 0.2s linear;
}
.stars:hover li{
    background-image: url(../image/ratingStarFilled.gif);
}
.stars li:hover ~ li{
   background-image: url( '../image/ratingStarEmpty.gif' );
}

Jquery返回的星值

$.ajax({
                type: "POST",
                url:'User/UserHome.aspx/BindInner',
                data: '{id:'+ id +'}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                cache: false,
                success: function(msg)
                {
 var xmlDoc = $.parseXML(msg.d);
                var xml = $(xmlDoc);
                innpageCount = parseInt(xml.find("innerPageCount").eq(0).find("innerPageCount").text());     
                var inncommonload = xml.find("InnerCommentonload");
               // $("#MainBox"+id).find("#dvCustomers1 table").remove();
                inncommonload.each(function () {
 var sno=inncommonload.find("SNo").text();
 var rate=inncommonload.find("Rating").text();
        var star='<ul class="stars"><li class="starvalue" id="1star'+sno+'"  onclick="AnsMark('+sno+',1); return false;"><a></a></li><li class="starrr" id="2star'+sno+'"   onclick="AnsMark('+sno+',2); return false;"></li><li class="starrr" id="3star'+sno+'"  onclick="AnsMark('+sno+',3); return false;"></li><li class="starrr" id="4star'+sno+'"  onclick="AnsMark('+sno+',4); return false;"></li><li class="starrr" id="5star'+sno+'"   onclick="AnsMark('+sno+',5); return false;"></li></ul>';
 });

                },
                failure: function (msg) {
                    alert(msg.d);
                },
                error: function (msg) {
                    alert(msg.d);
                }
            });

1 个答案:

答案 0 :(得分:0)

您可以使用此答案解决问题jQuery select all except first

您可以将速率舍入为整数,使用jQuery选择器选择那么多星并应用某些特定的CSS样式。