3

如何使用 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 响应。我不知道应该在自动完成的源函数或 onmessage 事件中放入什么,以便在接收到数据后填充自动完成列表。

4

1 回答 1

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 处理程序中,您获取这个保存的回调并显示收到的建议。

于 2013-09-12T15:25:08.097 回答