javascript - Laravel 5.3 和 Ajax 分页

Question

我正在开发一个游戏网站，目前正在制作球队的比赛页面。在此页面中，我有一个 Bootstrap 轮播来在球队之间切换并显示每个球队的比赛，但我将其限制为 5 场比赛。之后，我使用 Laravel 内置分页，使其可以在 AJAX 中工作。但是，当我更改页面时，它会更改我团队的所有比赛的内容(显然是因为我正在替换 div.matches 内容)。

如何对每个团队执行此操作，而不是用相同的内容替换每个团队？

分页在没有 AJAX 的情况下也能正常工作。

Controller

$matches = Matche::orderBy('date', 'DESC')->where('team', $team->id)->paginate(5, ['*'], $team->slug);

// it generates like so.. site.com/matches?csgo=1

HTML

<div class="carousel-item">
    <div class="matches">

        <div class="matches-box">
           ... Match #1 ...
        </div>
        <div class="matches-box">
           ... Match #2 ...
        </div>

        {{ $matches->links() }}

    </div>
</div>

JAVASCRIPT

$('body').on('click', '.pagination a', function(e){

    e.preventDefault();
    var url = $(this).attr('href');

    $.get(url, function(data){
        $('.matches').html($(data).find('.matches').html());
    });

});

Answer 1

Laravel 5.* 中的 Ajax 分页:

 $('.pagi').delegate('.pagination a','click',function(event){
        event.preventDefault();
        var pagiurl = $(this).attr('href');
          $.ajax({
                url: pagiurl,
                data:"",
                headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                type:"POST",
                dataType: "json",
                success: function(json) {
                    $('#renderstring').html(json.success);
                    $('.pagi').html(json.pagi);
                },
            });
    });