1

我正在研究类似于自动完成的功能，但不完全相同。主要区别在于 ajax 返回的匹配值显示在单独 div 的列表中（不是用户输入的输入文本框）。

无论如何，我使用了这个 SO 问题中的一些代码，如何延迟 .keyup() 处理程序直到用户停止输入？，让延迟工作。本质上，在每次按键时，jQuery 事件处理程序都会调用 myDelay()，给它一个运行函数和一个超时。如果在下一次按键之前超时尚未到期，则设置为触发的功能将替换为另一个（以及新的超时）。

我的问题是我要求延迟的函数是一个带有成功处理程序的 jQuery ajax 调用。当我更改成功处理程序中的值时，在父范围中看不到更改。

这是延迟功能。它存在于全局范围内。

var myDelay = (function () {
    var timer = 0;
    return function (callback, ms){
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    };
})();

这是使用延迟的代码：

var mySearch = {
    publicSearch : function () {
        $('#publicSearch').keypress(function () {
            myDelay(function () {
                var list;
                var term = $('#publicSearch input[type=text]').val();
                if (term) {
                    $.getJSON('/search/public', { term : term }, function (data) {

                        // assign some value to `list` here
                    })
                } else {
                    list='Please type a term to search on';
                }
                $('#publicSearch div').html(list);
            }, 1000);
        });
    }
}

在 ajax 成功处理程序中，我可以将值设置list为我喜欢的任何值，但它不会在父范围中看到。当我调用$('#publicSearch div').html(list)div 的内容时被设置为 null。

我认为这只是一个范围界定问题，但我无法解决。

请注意，使用延迟的代码位于 mySearch 命名空间中。这是因为我要构建几种不同类型的搜索，并且我需要一种组织代码的机制。

4

0 回答 0