评定星级

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <script src="jquery.js"></script>
 </head>
<style>
    a{display:inline-block;width:30px;height:30px;background-color:#f00;float:right;margin:5px;}
    a:hover,a:hover ~ a{background-color:#000}
    a.selected{background-color:#000}
</style>
 <body>
  <a></a>
  <a></a>
  <a></a>
  <a></a>
  <a></a>
  <a></a>
<script>
    $("a").each(function(i){
        $(this).click(function(){
            $('a').removeClass("selected");
            $("a:gt("+i+")").addClass("selected");
            $(this).addClass("selected");
        })
    })
 
</script>
 </body>
</html>

posted @ 2016-07-20 09:54  mrt_yy  阅读(103)  评论(0)  编辑  收藏  举报