在 jquery 中更改字体真棒图标

Posted 2023-02-24

【中文标题】在 jquery 中更改字体真棒图标

【英文标题】：change font awesome icon in jquery

【发布时间】：2022-01-02 02:36:37

【问题描述】：

我有一个用户 jQuery 的赞按钮。我想根据喜欢的状态更改图标（轮廓心到填充心）。问题是当我点击它清除删除图标时

预喜欢：

喜欢发帖：

如何阻止它清除图标，同时仍然更新点赞数，以及更改图标类

jQuery:

<script>
    $(document).ready(function()
         function updateText(btn, newCount, verb)
         btn.text(newCount + " " + verb)
     

     $(".like-btn").click(function(e)
       e.preventDefault()
       var this_ = $(this)
       var likeUrl = this_.attr("data-href")
       var likeCount = parseInt(this_.attr("data-likes")) | 0
       var addLike = likeCount + 1
       var removeLike = likeCount - 1
       if (likeUrl)
          $.ajax(
           url: likeUrl,
           method: "GET",
           data: ,
           success: function(data)
             console.log(data)
             var newLikes;
             if (data.liked)
                  updateText(this_, data.likescount, "like")                       
                        
               else 
                  updateText(this_, data.likescount, "unlike")
    
              
           , error: function(error)
             console.log(error)
             console.log("error")
           
         )
              
     )
 )
</script>  

点赞按钮：

<a class="like-btn" data-href=' post.get_api_like_url ' data-likes=" post.likes.count " href=" post.get_like_url "><i class="fa fa-heart-o like-heart" aria-hidden="true"></i> post.likes.count   </a>

【问题讨论】：

您可以创建一个元素并相应地附加您的条件元素 - api.jquery.com/append

【参考方案1】：

             if (data.liked)
              updateText(this_, data.likescount, "")
              $(".like-btn").prepend("<i></i>")
              $( "i" ).addClass( "fa fa-heart-o like-heart" );                  
                    
           else 
              updateText(this_, data.likescount, "")
              $(".like-btn").prepend("<i></i>")
              $( "i" ).addClass( "fa fa-heart-o like-heart" );