jQuery是一款兼容各瀏覽器的JavaScript庫，可極大地優(yōu)化DOM操作、事件處理、動(dòng)畫效果等方面的開發(fā)效率。jQuery評(píng)價(jià)五星效果是網(wǎng)頁設(shè)計(jì)中常用的交互效果之一。在下面的代碼示例中，我們將演示如何使用jQuery實(shí)現(xiàn)五星評(píng)價(jià)。

// HTML代碼
<div id="star" class="star">
<ul>
<li><a href="#" title="1 star"></a></li>
<li><a href="#" title="2 stars"></a></li>
<li><a href="#" title="3 stars"></a></li>
<li><a href="#" title="4 stars"></a></li>
<li><a href="#" title="5 stars"></a></li>
</ul>
</div>
// CSS代碼
.star ul {
margin: 0;
padding: 0;
list-style: none;
}
.star ul li {
display: inline-block;
margin-right: 5px;
}
.star ul li a {
display: block;
width: 25px;
height: 25px;
background-image: url(star.png);
}
.star ul li a:hover,
.star ul li a.current {
background-position: 0 -25px;
}
// JavaScript代碼
$(document).ready(function() {
$('#star li a').click(function() {
$('#star li a').removeClass('current');
$(this).addClass('current');
var title = $(this).attr('title');
alert('您的評(píng)價(jià)是：' + title);
return false;
});
});

在這段代碼中，我們使用了一個(gè)包含五個(gè)星級(jí)的無序列表，并使用CSS設(shè)置星級(jí)圖片和鼠標(biāo)懸停/選中效果。jQuery代碼則主要實(shí)現(xiàn)了點(diǎn)擊后添加選中樣式，并彈出提示框顯示所選的星級(jí)，同時(shí)防止鏈接跳轉(zhuǎn)。

總體而言，使用jQuery實(shí)現(xiàn)五星評(píng)價(jià)效果很簡(jiǎn)單且不需要額外的插件。只要結(jié)合CSS和JavaScript的知識(shí)，根據(jù)自己的需求進(jìn)行一些微調(diào)就可以了。