写出来的东西没效果，系统没报错，不知道哪里有问题-慕课网

写出来的东西没效果，系统没报错，不知道哪里有问题

来源：3-4 改进代码--JS第二次尝试

蒹葭苍沧

2020-10-23 20:24

<!DOCTYPE html><html lang="zh-cn">    <head>        <title>星级评分</title>        <meta charset="utf-8">        <style type='text/css'>            *{                margin: 0;                padding: 0;            }            li{                list-style: none;            }            .rating{                width: 390px;                height: 65px;                background: url(start.jpg);                margin: 100px auto;            }            .rating-item{                width: 65px;                height: 65px;            }        </style>    </head>    <body>        <ul class="rating" id='rating'>            <li class="rating-item" title='黑铁'></li>            <li class="rating-item" title='青铜'></li>            <li class="rating-item" title='白银'></li>            <li class="rating-item" title='黄金'></li>            <li class="rating-item" title='钻石'></li>            <li class="rating-item" title='王者'></li>        </ul>        <script src='jquery.min.js'></script>        <script type='text/javascript'>            var rating=(function(){                                                               var init=function(el,num){                    var $rating=$(el),                    $item=$rating.find('.rating-item');                                     //点亮                var lightOn=function(num){                    $item.each(function(index){                        if(index<num){                            $(this).css('background-position','0 -65px');                        }else{                            $(this).css('background-position','0 0');                        }                    });                };                   //初始化                lightOn(num);                //事件绑定                $rating.on('mouseover','.rating-item',function(){                    lightOn($(this).index()+1);                      }).on('click','.rating-item',function(){                    num=$(this).index()+1;                     }).on('mouseout',function(){                        lightOn(num);                    });                };                return {                    init:init                };                            })();                        rating.init('#rating',2);            rating.init('#rating2',3);            rating.init('#rating3',4);        </script>    </body></html>

写回答关注