Question

我正在使用jQuery UI自动完成插件，我通过jQuery中的append（）动态地向表单添加新字段。问题是我想创建新添加的字段和自动填充字段，因此即使使用相同的源URL，也会有超过1个自动填充字段。有什么帮助吗？

感谢。

Answer 1

喜欢这个吗？

var blahBlah = [
    "ActionScript",
    "AppleScript",
    "Asp",
    "BASIC",
    "C",
    "C++",
    "Clojure",
    "COBOL",
    "ColdFusion",
    "Erlang",
    "Fortran",
    "Groovy",
    "Haskell",
    "Java",
    "JavaScript",
    "Lisp",
    "Perl",
    "PHP",
    "Python",
    "Ruby",
    "Scala",
    "Scheme"
    ];
$(document).ready(function() {
    $("input#Foo").autocomplete({
        source: blahBlah
    });
    $("input#Bar").click(function() {
        var div = $("<div/>").text("Dynamically generated control").insertBefore("div:last");
        var input = $("<input/>").autocomplete({
            source: blahBlah
        }).appendTo(div);
    });
});

Demo here

Answer 2

在append()功能之后，您可以在新字段上调用autocomplete()，并为其提供与原始字段相同的来源。

Answer 3

我知道这是一个较旧的问题，但我遇到了同样的问题，我找到了解决方案。我发现的问题是使用JQuery的克隆函数来创建新的输入。自动完成功能似乎无法显示或工作。在这种情况下的问题是克隆复制所有内容，包括指向已复制输入的自动完成的原始自动完成信息。

要解决此问题，我手动创建了克隆，然后应用了自动完成功能并开始工作。实际上它始终有效，但它指向原始自动完成的显示。

要手动创建输入的副本，我执行了以下操作：

// note origInput = the input we are copying $("#myID")
var myClone = $("<input />")
                .attr("name", origInput.attr("name"))
                .attr("type", origInput.attr("type"))
                .attr("id", mynewid)
                .val("")
                .autocomplete( <your values here> );

myClone.appendTo(<parent where you want it to be>);

添加字段后，jQuery UI自动完成多个实例

3 个答案: