我对 ajax 和 jquery 的点赞按钮有疑问

Question

我在单击按钮后创建了一个赞按钮，该 div 将在第一次单击时重新加载它工作正常，必须能够单击#unlike，但是当 div 刷新 #unlike 时它不会正常工作 剂量不起作用需要重新刷新整个页面 这是我的按钮逻辑

<div class="" id="likebutton{{ $article->id }}">
                                   <div class="" id="content{{ $article->id }}">

                                <span>
                                <i type="button"
                   @if (in_array($article->id , App\User::find(Auth::user()->id)->like()->pluck('article_id')->toArray()))
                                    id="unlike"
                                    class="unlike fas fa-heart ms-2 float-end"
                                    style="font-size: 1.5rem; color: rgb(255, 34, 82);"
                                    @else
                                    class="like far fa-heart ms-2 float-end"
                                     style="font-size: 1.5rem; color: aliceblue;"
                                     @endif
                                    data-id="{{ $article->id }}"
                                     >
                                </i>

                          <a href="{{ route('articles.show', $article->slug)}}" role="button">
                                <i type="button"
                                class="far fa-eye"
                                style="font-size: 1.5rem;color: aliceblue;">
                                </i>
                           </a>
                        </span>

                             </div>
                         </div>

还有这个 ajax

function like(id = null) {
    return $.ajax("{{ route('likes') }}", {
        method: 'POST',
        data: {
           "_token": "{{ csrf_token() }}",
           " id" : id
        }
    });
}
 $('#unlike').click(function() {
        var id = ($(this).data("id"));
        let request = like($(this).data('id'));
        request.done(() => {
          // $('#like-'+id+'').removeClass("unlike fas fa-heart").addClass("like far fa-heart");
           $('#likebutton'+id+'').load(window.location.href + ' #content'+id+' > *');
        });
    });
$(function() {
    $('.like').click(function() {
        var id = ($(this).data("id"));
        let request = like($(this).data('id'));
        request.done(() => {
            //$('#like-'+id+'').removeClass("like far fa-heart").addClass("unlike fas fa-heart");
            $('#likebutton'+id+'').load(window.location.href + ' #content'+id+' > *');
        });
    });
});

Answer 1

对于不同 $(document).on('click', '#unlike', function() {

喜欢 $(document).on('click', '.like', function() {

改变这两行