具有相同输入名称的 AJAX 自动完成答案

【问题标题】：AJAX autocomplete with same input name具有相同输入名称的 AJAX 自动完成
【发布时间】：2014-10-03 06:42:05
【问题描述】：

我正在尝试使用 AJAX 自动搜索 (jquery-ui.min.js)

$(function() {  
    $(".auto").autocomplete({
        source: "search.php",
        minLength: 2
    });             
});

<input name="data[]" class="auto" type="text" style="width:100px;">

我想要多个输入 ajax auto complete 功能具有相同的输入名称，但只有第一个输入工作

<input name="data[]" class="auto" type="text" style="width:100px;">
<input name="data[]" class="auto" type="text" style="width:100px;">

【问题讨论】：

这段代码在 jsfiddle 上运行。浏览器控制台中是否显示任何错误？
是的，但只有第一个输入，实际上使用 javascript 添加新行，因此与上一行获得相同的名称值，我希望在每一行中添加自动搜索
因此，如果我理解正确，您只需从一个输入开始。您不能在创建新输入的 JavaScript 代码中为新创建的输入分配自动完成功能吗？

标签： ajax input autocomplete

【解决方案1】：

试试这个

HTML

<input name="data[]" class="auto" type="text" style="width:100px;">
<br>
<button id="add"> Add field</button>

function autoComplete(target) {
    target.autocomplete({
        source: "search.php",
        minLength: 2});
    target.attr('test','yes');
}

$(function() {  
    autoComplete($(".auto").first());    

    $("#add").click(function() {
        newInput = $(".auto").first().clone();
        newInput.insertAfter($(".auto").last());
        newInput.val('');
        autoComplete($(".auto").last());
    });
});

查看JSFiddle（检查浏览器控制台以查看它是否已发布到 search.php）

【讨论】：