Laravelのページネーションをクリックしたときに確認をする

やりたいこと

Laravelのページネーションを選択したときに
本当に移動していいか確認したい。

環境
Laravel6
jQuery

やり方

下記のようにページネーションを設置する

app.blade.php

{{$hoges->links()}}

すると、標準だとこのようなHTMLに展開されます。

<nav>
    <ul class="pagination">
        <li class="page-item disabled" aria-disabled="true" aria-label="« 前">
            <span class="page-link" aria-hidden="true">‹</span>
        </li>
        <li class="page-item active" aria-current="page">
            <span class="page-link">1</span>
        </li>
        <li class="page-item">
            <a class="page-link" href="//localhost;page=2">2</a>
        </li>
        <li class="page-item">
            <a class="page-link" href="//localhost;page=2" rel="next" aria-label="次 »">›</a>
        </li>
    </ul>
</nav>

これを確認すると、現在いるページ（1ページ目）や前へのボタンはspanタグになっています。

つまり page-itemクラスの子要素で、page-linkクラスを持ったaタグがクリックされたときに確認すればよさそうです。

confirm.js

    $(".page-item a[class='page-link']").on('click', function (e) {
        if (!confirm('移動しますか？')) {
            e.preventDefault();
        }
    })
})

押してみると、確認が表示されました。