这次给大家带来jquery做出评分系统，jquery做出评分系统的注意事项有哪些，下面就是实战案例，一起来看一下。
在电商网站，我们经常会用到五星评分的功能，现在用jQuery实现一个简单的demo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>五角星评分案例</title>
<style>
* {
padding: 0;
margin: 0;
}
.comment {
font-size: 40px;
color: teal;
}
.comment li {
float: left;
}
ul {
list-style: none;
}
</style>
</head>
<body>
<ul class="comment">
<li>☆</li>
<li>☆</li>
<li>☆</li>
<li>☆</li>
<li>☆</li>
</ul>
<script src="jquery-1.12.2.js"></script>
<script>
$(function () {
var wjx_k = "☆";
var wjx_s = "★";
//prevAll获取元素前面的兄弟节点，nextAll获取元素后面的所有兄弟节点
//end 方法；返回上一层
//siblings 其它的兄弟节点
//绑定事件
$("li").on("mouseenter", function () {
$(this).html(wjx_s).prevAll().html(wjx_s).end().nextAll().html(wjx_k);
}).on("click", function () {
$(this).addClass("active").siblings().removeClass("active")
});
$("ul").on("mouseleave", function () {
$("li").html(wjx_k);
$(".active").text(wjx_s).prevAll().text(wjx_s);
})
});
</script>
</body>
</html>相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
Atas ialah kandungan terperinci jquery做出评分系统. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Apakah pemalam jquery?
Bagaimana untuk mengendalikan json dengan jquery
Bagaimana untuk memadam elemen dalam jquery
Penggunaan kaedah jQuery hover().
jquery melaksanakan kaedah paging
Apakah elemen tersembunyi dalam jquery
Apa yang ditonjolkan dalam jquery
Adakah python bahagian hadapan atau belakang?
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
