Ajax 异步删除资源，多次请求问题

我在用 Laravel 框架构建 web 应用，在使用 Ajax 异步删除资源的时候，前端发送的 delete 请求一次比一次多一个

这是我的 Ajax 代码

function del(){
        $('#del').click(function (){
            $.ajax({
                type: "DELETE",
                url: '/api/apiposts/{{$id}}',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success:function (result){
                    console.log("success:" + result);
                    
                    //location.reload();
                },
                error:function (result){
                    console.log("error:" + result);
                }
            })
        });
    }
    
    <input type="button" value="删除" id="del" onclick="del()">
    

第一次点 button 的时候没有请求，这是 burp 抓到的包