1111
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>五星评价(图片实现) </title> <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js"></script> </head> <body> <div class="starMain" style="width: 100%;margin: 0 auto;height: 10px;line-height:10px;margin-top: 1px;"> <img class="ev-star" src="/Script/image/evaluate/empty.png" /> <img class="ev-star" src="/Script/image/evaluate/empty.png" /> <img class="ev-star" src="/Script/image/evaluate/empty.png" /> <img class="ev-star" src="/Script/image/evaluate/empty.png" /> <img class="ev-star" src="/Script/image/evaluate/empty.png" /> </div> <br/> <br /> <input class="preData starResult" type="text" /> <script> $(function () { $(".starMain").each(function () { starFun($(this)); }) }); function starFun(element) { var imgs = element.find(".ev-star"); var len = imgs.length; for (var i = 0; i < len; i++) { imgs[i].index = i; imgs[i].onclick = function () { var count = 0; for (var j = 0; j <= this.index; j++) { imgs[j].src = "/Script/image/evaluate/full.png"; count++; } for (var h = (this.index + 1); h < len; h++) { imgs[h].src = "/Script/image/evaluate/empty.png"; } var starResult = $(this).parent().parent().find(".starResult"); starResult.val(count); } } } </script> </body> </html>
五角星:
来源:https://www.cnblogs.com/kikyoqiang/p/11037551.html