ajax - 如何在不一次又一次发送发布请求到 laravel 路由的情况下验证 onkeyup 事件

Question

使用 Ajax 代码验证 Activity 函数

$(document).on('keyup','#activity_name',function () {
            var error_activity = '';
            var activity = $('#activity_name').val();
            var _token = $('input[name="_token"]').val();
            $.ajax({
                type : 'post',
                url : '{{ url('checkactivity') }}',
                data :{activity:activity, _token:_token},
                success:function (result) {
                    if(result == 'unique'){
                        $('#activity_status').html('<lable class="text-sucess" style="color: blue"></lable>');
                        $('#activity').removeClass('has-error');
                        $('#activity_btn').attr('disabled',false);
                    }
                    else
                    {
                        $('#activity_status').html('<lable class="text-danger">Try Another!</lable>');
                        $('#activity').addClass('has-error');
                        $('#activity_btn').attr('disabled','disabled');
                    }
                }
            });
        });

我的输入字段，当我在我的输入字段中输入一个单词时，他总是在这里调用一个事件 Onkeyup，并且在每个单词上他发送一个发布请求。

<div class="form-group">
                <label for="checkbox">Group</label>
                <select class="form-control form-control-sm"  id="activitygroup" name="activitydeleverable">
                    <option>Select</option>
                    @foreach(App\Groups::all() as $group_name)
                        <option value="{{ $group_name->id }}">{{ $group_name->name }}</option>
                    @endforeach
                </select>      
            </div>
            <button type="submit" id="activity_btn" onclick="insertactivity()" class="btn btn-info">Insert</button>

这是我的 Controller 函数

function checkactivity(Request $request){
    $data = Activities::whereName($request->activity)->first();
    if (!is_null($data)){
        echo 'not_unique';
    }
    else
    {
        echo 'unique';
    }
}

我的代码工作完美，但我遇到了问题。在每个单词上，我的 onkeyup 事件 Ajax 向 db 发送一个 post 请求，并检查数据是否在 db 中可用。但我必须停止这样做，一次又一次地发布请求。它可能会减慢我的系统，所以我必须解决这个问题请解决这个逻辑问题我必须停止这个帖子请求或只需要一个帖子请求。 You can see no of request in image

Answer 1

您将在这个已解决的问题中找到有关您所需解决方案的所有信息:

How to delay the .keyup() handler until the user stops typing?