如何延迟select-2,以便在用户输入数据后等待一段时间

Question

我知道上面的事情可以通过在AJAX调用中使用quietMillis来实现,但我使用查询来缓存数据.在这里,我无法延迟AJAX呼叫.下面是代码

$('#AssetType').select2({
    cacheDataSource: [],
    placeholder: ' ',
    quietMillis: 3000,
    query: function q(query) {
        self = this;
        var key = query.term;
        var cacheData = self.cacheDataSource[key];
        if (cacheData) {
            query.callback({
                results: $.map(cacheData, function (item) {
                    return {
                        text: item.LongDescription,
                        id: item.AssetTypeID
                    }
                })
            });
            return;
        }
        else {
            $.ajax({
                url: 'http://localhost:52377/api/reference/asset/types/' + key,
                dataType: 'json',
                type: 'GET',
                quietMillis: 3000,
                //data: function (query) {
                //    return { assetType: query.term, };
                //},
                success: function (data) {
                    self.cacheDataSource[key] = data;
                    query.callback({
                        results: $.map(data, function (item) {
                            return {
                                text: item.LongDescription,
                                id: item.AssetTypeID
                            }
                        })
                    });
                },
                cache: true
            })
        }
    }

});

是否有任何工作来延迟AJAX调用,以便每次击键都不会触发AJAX调用？使用"查询"的原因是用于缓存,这不是通过在AJAX调用中将缓存设置为true来实现的.

Answer 1

根据select2文档,您可以轻松完成此操作.

每次按键都会触发一个请求,我可以延迟吗？

默认情况下,只要用户更改其搜索词,Select2就会触发新的AJAX请求.您可以使用ajax.delay选项设置去抖动请求的时间限制.

这将告诉Select2在将请求发送到您的API之前等待250毫秒.

$('select').select2({
  ajax: {
    url: '/example/api',
    delay: 250
  }
});

Answer 2

我找到了一种延迟触发的方法。我已经在underscore.js中使用了反跳功能的实现。代码现在看起来像这样

query: debounce(function q(query) {..
.....
}, 350),

希望它可以帮助某人。