javascript - 如何将 jQuery 自动完成插件用于链接的输入字段？

Question

我正在使用 jQuery Autocomplete plugin .我在表单上有两个输入字段，inputfield1 和 inputfield2。

我将自动完成附加到第一个字段。当该字段失去焦点时，我想检查是否输入了一个值，如果输入了，则进行 AJAX 调用以检索一些以“\n”分隔的字符串，并使用它们驱动第二个字段的自动完成。

下面是我用来执行此操作的代码:

/*Receive data from server for autocomplete*/
$("#inputfield1").autocomplete("<url1>"); 

$("#inputfield1").blur(function(){

    // Attach autocomplete if inputfield1 field is not empty
    if($("#inputfield1").val() != ""){
        var url = "<url2>?q="+$("#inputfield1").val();
        $.get(url,function(data){
            result=data.split("\n");
            $("#inputfield2").autocomplete(result);

        });
    }
});

但是一件奇怪的事情发生了:我能够成功地将自动完成附加到第一个字段，但是我必须将焦点两次放在第二个字段上才能在其上使用自动完成。有什么办法可以解决这个问题吗？

Answer 1

试试这个简化的测试。如果这有效，请检查您的 result 是否真的包含您的想法(提醒它或将其写入控制台)。拆分后可能还有其他字符(即空格(前导空格，\t 或 \r)尝试 trim 结果数组的每个值。

var data1 = ["a123", "b123", "c123", "d123", "e123", "f123", "g123", "h123", "i123", "j123",   "k123", "l123", "m123", "n123", "o123", "p123", "q123", "r123", "s123", "t123", "u123", "v123", "w123", "x123", "y123", "z123"];
var data2 = 'a123\nb123\nc123\nd123\ne123\nf123\ng123\nh123\ni123\nj123\nk123\nl123\nm123\nn123\no123\np123\nq123\nr123\ns123\nt123\nu123\nv123\nw123\nx123\ny123\nz123';
$("#inputfield1").autocomplete(data1);

$("#inputfield1").blur(function(){
    if($("#inputfield1").val() != ""){
        var result=data2.split("\n");
        $("#inputfield2").autocomplete(result);
    }
});