一种利用js实现的仿淘宝商品评价功能的方法

最新推荐文章于 2023-04-15 10:16:18 发布

freeson_csdn

最新推荐文章于 2023-04-15 10:16:18 发布

阅读量6.6k

点赞数

分类专栏：前端文章标签： js 淘宝星级评价

本文链接：https://blog.csdn.net/biaobiao1217/article/details/40540375

版权

本文介绍了一种使用JavaScript来实现类似淘宝的商品评价功能，包括CSS样式布局、HTML结构设计以及JavaScript逻辑实现。通过结合星级选择和评论展示，提供用户友好的交互体验。

摘要由CSDN通过智能技术生成

CSS：

    ul{list-style-type:none;}
    #star{position:relative;width:100%;margin:5px;height:26px;line-height:26px;}
    #star ul,#star span{float:left;display:inline;height:26px;line-height:26px;}
    #star ul{margin:0px 5px; padding:0px;}
    #star li{float:left;width:24px;cursor:pointer;text-indent:-9999px;background:url(../images/icon.png) no-repeat;}
    #star li.on{background:url(../images/star.png) no-repeat;}

HTML：

<div id="star">
    <span>点击星星就能评价</span>
    <ul style="width:150px;">
       <li><a href="javascript:;">1</a></li>
       <li><a href="javascript:;">2</a></li>
       <li><a href="javascript:;">3</a></li>
       <li><a href="javascript:;">4</a></li>
       <li&