jquery切换星形脚本

时间:2016-05-08 07:58:01

标签: jquery html css svg

我想使用以下jquery脚本来打开/关闭星形链接按钮类,这也取决于CSS中SVG精灵的背景图像位置。

我有下面的jquery函数可能需要进行一些修改以提高效率,但是如何让它适用于SVG精灵并更新示例页面以反映管理员所做的开/关切换设置? / p>

数据库的后端将用C#编写,但我需要让前端工作......

$(function() {
$(".star").click(function() {
    var id = $(this).attr("id");

    if($(this).hasClass("starred")) {
        $.post("profilepage.html", {id: id}, function(resp) {
            $(this).removeClass("starred").find("img").attr("src", "star-icon-f.png");
        });
    }

    else {
        $.post("profilepage.html", {id: id}, function(resp) {
            $(this).addClass("starred").find("img").attr("src", "star-icon.png");
        });
    }

    return false;
});
});

1 个答案:

答案 0 :(得分:1)

$(".star").click(function() {
    var that = $(this);
    var id = that.attr("id");

    var isStar = false;
    var src = 'star-icon.png';
    if(that.hasClass("starred")) {
        isStar  = true;
        var src = 'star-icon-f.png';
    }

    //Do the post
    $.post("profilepage.html", {id: id}, function(resp) {
        that.find("img").attr("src", src);
        if (isStar) {
            that.removeClass("starred");
        } else {
            that.addClass("starred");
        }
    });

    return false;
});