Question

我有一个链接，如果从数据库中单击或查询为true，则图标显示完整的内容，信息将保存在数据库中，如下所示：

<a id="fav"  href="#"><i <?if($fe == 1){?>class="faved"<?}else{?>class="fav"<?}?>></i></a>

$("#fav i.fav").click(function(){
                fav= new XMLHttpRequest();
                fav.open("GET", "http://test.php?u=<?=$user_id?>",  true);
                fav.send();
                $("#fav i").removeClass('fav').addClass('faved');
            });

            $("#fav i.faved").click(function(){
                fav= new XMLHttpRequest();
                fav.open("GET", "http://test.php?u=<?=$user_id?>",  true);
                fav.send();
                $("#fav i").removeClass('faved').addClass('fav');
            });

目前它工作得很好，但我遇到的问题是，如果用户决定取消收藏某个页面，它会保存另一个记录或尝试再次删除，具体取决于其当前状态。如何根据状态进行切换。例如，如果它没有被收藏，则在单击它时保存到数据库，并且无需刷新，再次单击它将从数据库中删除。

更新

我也在链接中有动作告诉我的php删除或保存记录。例如：http://test.php?u=<?=$user_id?>a=1（保存）http://test.php?u=<?=$user_id?>a=2（删除）

ANSWER

基于@ epascarello的回答。

$("#fav").on("click", "i.fav", function(){
                var icon = $(this);
                var makeFavorite = icon.hasClass("fav");
                $.post("http://test.php&u=<?=$user_id?>&a=1",{isFav:makeFavorite}, function(){
                    icon.toggleClass("fav").toggleClass("faved");
                });
            });



$("#fav").on("click", "i.faved", function(){ 
            var icon = $(this);
            var delFavorite = icon.hasClass("faved");
            $.post("http://test.php&u=<?=$user_id?>&a=2",{isFav:delFavorite}, function(){
                icon.toggleClass("faved").toggleClass("fav");
            });   
        });

Answer 1

拨打一个电话而不是两个电话。这是相同的逻辑，只是做检查！ [假设您正在使用jQuery]

$("#fav").on("click", "i.fav, i.faved", function(){
    var icon = $(this);
    var makeFavorite = icon.hasClass("fav");
    $.post("http://test.php?u=<?=$user_id?>",{isFav:makeFavorite}, function(){
        icon.toggleClass("fav").toggleClass("faved");
    });  
});

带有XMLHttpRequest的收藏夹按钮

1 个答案: