jQuery五角星评分

查看演示立即下载

插件描述：鼠标移上去能显示评分，代码简单13行搞定。

1. 给所有的li注册mouseenter事件

2. 让当前li和前面所有的li变成实心,让后面所有的兄弟变成空心

3. 离开ul的时候，把所有的li变成空心

$(function () {
            var wjx_s = "★";
            var wjx_k = "☆";
            //1. 给所有的li注册mouseenter事件
            $(".comment li").mouseenter(function () {
                //2. 让当前li和前面所有的li变成实心,让后面所有的兄弟变成空心
                //前面兄弟：prevAll()：
                //后面兄弟：nextAll()：
                $(this).text(wjx_s).prevAll().text(wjx_s);
                $(this).nextAll(wjx_k);
            });
            //2. 离开ul的时候，把所有的li变成空心
            $(".comment").mouseleave(function () {
                $(this).children().text(wjx_k);
                //如果我知道了我刚刚点了那个五角星
                //可以让点的那个五角星以及前面的兄弟变成实心就可以。
                //4. 找到我点击的那个li
                $("li.current").text(wjx_s).prevAll().text(wjx_s)
            });
            //3. 给所有的li注册点击事件，点击的时候，留下点东西(class)
            $(".comment li").click(function () {
                $(this).addClass("current").siblings().removeClass("current")
            })
        })

4. 给所有的li注册点击事件，点击的时候，留下点东西(class)

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效：商品展示点击增加物品
下一个特效：飞翔的小鸟