Question

我正在使用jQuery Autocomplete。它在我不想要的每个按键上发出AJAX请求。如果来自先前AJAX请求的数据与搜索匹配，则不应再发出任何AJAX请求。

<script>
    $('#tags').autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '/TestDDl/Index',
                // data: "{ 'prefix': '" + request.term + "'}",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    response($.map(data.user, function (item) {
                        return {
                            label: data.name,
                            val: data.val
                        }
                    }))
                },
                error: function (response) {
                    alert(response.responseText);
                },
                failure: function (response) {
                    alert(response.responseText);
                }
            });
        },
        autoFocus: true,
        keypress: function (event, ui) {
            alert('Not Selected');
            if (!ui.item) {
                alert('Not Selected');
            }
        }
    });
});

如果我输入的用户名已经在之前的AJAX请求数据中，那么它不应该在下一次按键时发出AJAX请求。

Answer 1

您可以声明一个变量，向其提供用户输入，然后在您的成功函数中更新它。在下一次调用之前，检查您的变量是否与下一个数据匹配。

这样的事情：

<script>
    var recent = '';
    $('#tags').autocomplete({
        source: function (request, response) {
            if (recent == request.term) {
                return;
            }
            recent = request.term;
            $.ajax({
                url: '/TestDDl/Index',
                data: "{ 'prefix': '" + request.term + "'}",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    response($.map(data.user, function (item) {
                        return {
                            label: data.name,
                            val: data.val
                        }
                    }))
                },
                error: function (response) {
                    alert(response.responseText);
                },
                failure: function (response) {
                    alert(response.responseText);
                }
            });
        },
        autoFocus: true,
        keypress: function (event, ui) {
            alert('Not Selected');
            if (!ui.item) {
                alert('Not Selected');
            }
        }
    });
</script>

Answer 2

    <script>
    window.xyz = []; //For saving history
    $('#tags').autocomplete({
        source: function (request, response) {
            if(xyz[request]){
                response(xyz[request]); // Return previously saved data
            }else(
                $.ajax({
                    url: '/TestDDl/Index',
                    // data: "{ 'prefix': '" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        var res = $.map(data.user, function (item) {
                            return {
                                label: data.name,
                                val: data.val
                            }
                        });
                        xyz[request]=res; //set data to reuse later
                        response(res)
                    },
                    error: function (response) {
                        alert(response.responseText);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    }
                });
            }
        },
        autoFocus: true,
        keypress: function (event, ui) {
            alert('Not Selected');
            if (!ui.item) {
                alert('Not Selected');
            }
        }
    });
</script>

Answer 3

你的下一个ajax请求应该在第一个ajax请求的Success函数中。在那里修改逻辑。如果你发现匹配不调用第二个ajax请求，则调用第二个ajax请求，所有都应该成功第一个ajax请求的功能。

仅当先前ajax请求数据中的项不匹配时，Jquery才会自动完成ajax请求

3 个答案: