南强小屋 Design By 杰米
html
<body> <div id="div"> <ul> <li>☆</li> <li>☆</li> <li>☆</li> <li>☆</li> <li>☆</li> </ul> </div> <p id="p"></p> <p id="score"></p> </body>
id="p"显示即时分数
id="score"显示最终分数----------------------------------------------
javascript“
$(function () { //为所有的li标签绑定mouseout和mouseover事件。bind({事件名:function(){},事件名:function(){}})的方法绑定多个事件 $("#div li").bind({ mouseout:function () { $(this).css("color", "black").html("☆").prevAll().css("color", "black").html("☆") }, mouseover: function () { $(this).css("color", "red").html("★").prevAll().css("color", "red").html("★") } }); //=实时显示分数.【index】搜索匹配的元素,并返回相应元素的索引值,从0开始计数。 $("#div li").mouseover(function () { $("#p").html(parseInt( $(this).index("#div li"))+1); }); //鼠标按下时,确定分数。额,就不更改了,大局已定。 $("#div li").mousedown(function () { $("#score").html(("你选择的分数是" + (parseInt($(this).index("#div li")) + 1))); $(this).css("color", "red").html("★").prevAll().css("color", "red").html("★") //全部li标签的绑定事件全部清除--unbind方法可以加参数清除特定的事件。不加全部清除 $(this).unbind().prevAll().unbind().nextAll().unbind(); }); })
出现的效果是这样的:
可惜的是你一点击下去--就不可更改了。真的是很悲伤啊。大概也只是做了一个小样子而已。
prevAll() 和nextAll()这两个方法?暂且说方法吧。在jquery的文档可以查得到。
index 在jquery 里是返回元素的索引值,从零开始。分数呢就加1,
标签:
淘宝,评分
南强小屋 Design By 杰米
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
南强小屋 Design By 杰米
暂无jquery实现类似淘宝星星评分功能有截图的评论...
P70系列延期,华为新旗舰将在下月发布
3月20日消息,近期博主@数码闲聊站 透露,原定三月份发布的华为新旗舰P70系列延期发布,预计4月份上市。
而博主@定焦数码 爆料,华为的P70系列在定位上已经超过了Mate60,成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢?
根据目前爆料的消息来看,华为P70系列将推出三个版本,其中P70和P70 Pro采用了三角形的摄像头模组设计,而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智,但辨识度绝对拉满。