相似淘寶五星點評，Jquery實現代碼

時間 2019-12-04

原文原文鏈接

<!--默認五星，根據鼠標點擊判斷-->

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style>        .box{height:40px;padding:10px;}        .box ul, .box span{float:left;}        .bg_star{backgroud:url"//這裏放沒有背景星星的圖片地址"}        .bg_red{backgroud:url"//這裏放有背景星星的圖片地址"}    </style></head><body><div class="box">    <span >評分</span>    <ul>        <li class="bg_star bg_red"></li>        <li class="bg_star bg_red"></li>        <li class="bg_star bg_red"></li>        <li class="bg_star bg_red"></li>        <li class="bg_star bg_red"></li>    </ul></div></body><script src="https://code.jquery.com/jquery-3.4.1.min.js"></script><script>    var index = $(this).index();    $(this).addClass('bg_red');    if(index>0){        $(this).parent().find('li:lt('+index+')').addClass('bg_red');        $(this).parent().find('li:gt('+index+')').removeClass('bg_red');    }else{        $(this).parent().find('li:gt('+index+')').removeClass('bg_red');    }</script></html>

相關標籤/搜索

相似淘寶五星點評 ，Jquery實現代碼

相似淘寶五星點評，Jquery實現代碼