淘先锋技术网

首页 1 2 3 4 5 6 7

这篇文章是关于使用jquery实现文章的评论星级下载功能。从最简单的代码一步一步实现,让大家更好地理解jquery的应用。


    $(document).ready(function(){
        //绑定鼠标经过事件
        $(".star li").mouseover(function(){
            $(this).parent().find("li").removeClass("active");
            $(this).addClass("active").prevAll().addClass("active");
        })
        //绑定鼠标离开事件
        $(".star li").mouseout(function(){
            $(this).parent().find("li").removeClass("active");
        })
        //绑定点击事件
        $(".star li").click(function(){
            var star_num = $(this).attr("data-num");
            //调用后台接口,进行评分操作
            $.ajax({
                type: "POST",
                url: "/comment",
                data: { rating: star_num },
                success: function(data){
                    if(data.status == 0){
                        alert(data.message);
                    }else{
                        alert("评分成功!");
                    }
                },
                error: function(){
                    alert("评分失败!");
                }
            })
        })
    });

jquery文章评论星级下载

上面的代码实现了评论区的星级评分功能,通过jquery的鼠标经过、离开和点击事件,实现了星级的动态展示和评分操作。后续开发中可基于此代码进行优化和修改,增加评论的其他功能,如点赞、回复、查看等。