Question

如何使用nodejs，sockjs和jquery ui自动完成功能实现自动完成功能？

这是脚本部分

function DocumentReady() {
    $("#movieTitle").autocomplete({
        minLength: 3,
        source: function() {
            var title = $("#movieTitle").val();
            sock.send(title);
        },
        delay: 1000
    })
}

$(document).ready(DocumentReady);


var sock = new SockJS('http://localhost:9999/ws');

sock.onopen = function() {
    console.log('open');
};
sock.onmessage = function(e) {
    console.log('message', e.data);
};
sock.onclose = function() {
    console.log('close');
};

我正在将数据发送到服务器，我正在接收json响应而没有问题。我不知道应该在autocomplete的源函数或onmessage事件中放入什么，这样我才能在收到数据后填充自动完成列表。

Answer 1

处理此问题的一种方法是有效地使用队列。在此自动完成窗口小部件中输入内容时，请对搜索词进行排队。当您收到来自sockjs的消息时，请出列并添加自动完成的建议。

以下是此方法的基本示例（仅限客户端，服务器正常工作）：

$(document).ready(function() {
    $("#movieTitle").autocomplete({
        source: function(request, response) {
            sock.send(request.term);
            pending.push(response);
        }
    });
});

var pending = [];
var sock = new SockJS('http://localhost:9999/ws');
sock.onmessage = function(e) {
    var response = pending.shift();
    response($.parseJSON(e.data));
};

如果您觉得不需要排队多个查询，您可以从源选项中保存最新的“响应”参数。然后，在onmessage处理程序中，您将获取此已保存的回调并显示收到的建议。

jquery ui autocomplete + websockets实现

1 个答案: