JS实现星级评价 - 相关文章

【JS实现星级评价】的更多相关文章

JS实现星级评价

说明: 本方法采用了Jquery库,暂时检测兼容IE8版本.本示例的2种颜色的星星都是放入了一张png图片当中,当然还有其他的一些实现思路.本示例展示的情况是当前页面只有一个星级评价的情况. 思路: 通过对星级显示元素的,mouseenter,mouseout,click 三个事件的监听,从而星星显示的个数.其中我用了2个变量(temp_value,choice_value)来存放当前选定星级的值和当前临时的星级值: temp_value : 临时的星级值: choice_value : 选择的…

iOS：自己写的一个星级评价的小Demo

重新整理了下自己星级评价的Demo,可以展示星级评价,可以动态修改星级. github的地址:https://github.com/hunterCold/HYBStarEvaluationView a simple tool of star evaluation 一个简单的星级评价的工具简单调用: HYBStarEvaluationView *starView = [[HYBStarEvaluationView alloc]initWithFrame:CGRectMake(, , , ) nu…

js实现星级评分效果（非常规5个li代码）

1. 前言此方案受到JS单行写一个评级组件启发,自己写了一个简单Demo. 功能有正常滑动,动态显示实心星星个数:当点击确认,则保持当前的实心星星个数:再移动时未点击,则离开后还是保持之前的状态. 此demo没有文字信息等提示,可以根据需要自行添加使用. 2. 代码 <!DOCTYPE html> <html> <head> <title>Star Rating</title> <script src="http://apps.…

js 实现星级评分

最近的项目中有一个星级评分的需求, 自己就写了一下, 由于可能一个页面要用到多个,就采用了面向对象的写法. 用到的png图片也放到这里. js要用到jquery. css: .sr-star{ display: flex; margin-bottom:50px; } .sr-star-item{ width:18px; height:18px; background:url("./img/empty.png") no-repeat; background-size:18px 1…

js实现星级评分之方法一

利用一个星级评分的小案例,来逐步封装js星级评分插件. 从最基础的js知识,通过一个小的demo,逐步学习js的面向对象知识. 从浅到深,逐步递进. 图片素材 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>星级评分--第一种实现方式</title> </head> <style type="text/css&quo…

jquery 星级评价插件jquery Raty的使用

需要引入的js <script type="text/javascript" src="<%=basePath%>resources/js/jquery.min.js"></script> <script type="text/javascript" src="<%=basePath%>resources/js/jquery.raty.js"></script&…

原生JS实现-星级评分系统

今天我又写了个很酷的实例:星级评分系统(可自定义星星个数.显示信息) sufuStar.star();使用默认值5个星星,默认信息 var msg = [........]; sufuStar.star(10,msg);自定义星星个数为10.显示信息msg格式参考默认值,条数必须和星星个数一致: 自己实现一些实例,有个好处,能增加应用各知识点的熟练度,还能检验出自己的薄弱项!一经发现,立即翻API文档恶补! 不知道是不是我太笨,这个实例居然写了整整一天! 不废话了,先说下这个实例涉及的知识点:…

用这个插件jquery.raty.js————用于星星评价（这个案例用于后台传数据给我，前台显示星星个数）

1.引入jquery.js文件 2.引入jquery.raty.js 3.页面中放在这个:<span class="readOnly" data-path="images" ><i>4.5</i></span> 4.js: function star(obj,num){ $(obj).raty({ path: function() { return this.getAttribute('data-path');//路径…

jquery实现仿商品星级评价

一,HTML部分 <div id="rating-star"> <a href="#">0</a> <a href="#">1</a> <a href="#">2</a> <input type="hidden" id="goodLevel" /> </d…

vue实现星级评价效果

希望对你们有用,已经自己试过可以的才发布出来的效果如下: html: <template> <div class="evaStar"> <ul class="star"> <li v-for="(itemClass,index) in itemClasses" :class="itemClass" class="star-item" @click="st…