我前面博客写过一个星级评论的原生写法，非常复杂，今天就通过jquery来写一个简单的星级点亮的效果，来看代码：
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title><style> ???.ct-star { ???????display: inline-block; ???????margin: 0 1px; ???????width: 19px; ???????height: 19px; ???????background: url(img/stars.png) no-repeat; ???????vertical-align: -2px; ???????cursor: pointer; ???} ???.ic-star-off { ???????background-position: -39px 0; ???}</style></head><body> ???<span class="star"> ???????<b class="ct-star ?ic-star-off"></b> ???????<b class="ct-star ?ic-star-off"></b> ???????<b class="ct-star ?ic-star-off"></b> ???????<b class="ct-star ?ic-star-off"></b> ???????<b class="ct-star ?ic-star-off"></b> ???</span></body><script src="js/jquery-1.11.3.min.js"></script><script> ???$(function(){ ???????$(".star b").on("mouseenter",function(){ ???????????$(this).removeClass("ic-star-off").prevAll().removeClass("ic-star-off"); ???????}); ???????$(".star").on("mouseleave",function(){ ???????????$(this).children().addClass("ic-star-off"); ???????????$("b.curr").removeClass("ic-star-off").prevAll().removeClass("ic-star-off"); ???????}); ???????$(".star b").on("click",function(){ ???????????$(this).addClass("curr").siblings().removeClass("curr") ???????}) ???})</script></html>效果图就不展示了，将代码拷贝自己可以试试哦，一定要注意自己引用文件的路径！好了，今天就写这么一个简单的小例子。
jquery简单几句代码实现星级评论效果
原文地址：https://www.cnblogs.com/web001/p/8480856.html