基本信息
源码名称:鼠标滑过五角星打分星级评分代码jQuery
源码大小:0.04M
文件格式:.zip
开发语言:js
更新时间:2019-07-03
   友情提示:(无需注册或充值,赞助后即可获取资源下载链接)

     嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300

本次赞助数额为: 2 元 
   源码介绍

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery鼠标滑过五角星打分星级评分代码</title>

<link rel="stylesheet" href="css/css.css">

<script src="js/jquery.js"></script>

</head>
<body><script src="/demos/googlegg.js"></script>

<div id="starRating">
    <p class="photo">
        <span><i class="high"></i><i class="nohigh"></i></span>
        <span><i class="high"></i><i class="nohigh"></i></span>
        <span><i class="high"></i><i class="nohigh"></i></span>
        <span><i class="high"></i><i class="nohigh"></i></span>
        <span><i class="high"></i><i class="nohigh"></i></span>
    </p>
    <p class="starNum">0.0分</p>
    <div class="bottoms">
        <a class="garyBtn cancleStar">取消评分</a><a class="blueBtn sureStar">确认</a>
    </div>
</div>
<script>
    $(function () {
        //评分
        var starRating = 0;
        $('.photo span').on('mouseenter',function () {
            var index = $(this).index() 1;
            $(this).prevAll().find('.high').css('z-index',1)
            $(this).find('.high').css('z-index',1)
            $(this).nextAll().find('.high').css('z-index',0)
            $('.starNum').html((index*2).toFixed(1) '分')
        })
        $('.photo').on('mouseleave',function () {
            $(this).find('.high').css('z-index',0)
            var count = starRating / 2
            if(count == 5) {
                $('.photo span').find('.high').css('z-index',1);
            } else {
                $('.photo span').eq(count).prevAll().find('.high').css('z-index',1);
            }
            $('.starNum').html(starRating.toFixed(1) '分')
        })
        $('.photo span').on('click',function () {
            var index = $(this).index() 1;
            $(this).prevAll().find('.high').css('z-index',1)
            $(this).find('.high').css('z-index',1)
            starRating = index*2;
            $('.starNum').html(starRating.toFixed(1) '分');
            alert('评分:' (starRating.toFixed(1) '分'))
        })
        //取消评分
        $('.cancleStar').on('click',function () {
            starRating = 0;
            $('.photo span').find('.high').css('z-index',0);
            $('.starNum').html(starRating.toFixed(1) '分');
        })
        //确定评分
        $('.sureStar').on('click',function () {
            if(starRating===0) {
                alert('最低一颗星!');
            } else {
               alert('评分:' (starRating.toFixed(1) '分'))
            }
        })
    })
</script>


</body>
</html>