Javascript 未选择“自动完成”

自动完成搜索框的数量是基于#AddButton动态的。“自动完成”正在工作，但当我选择值时，它没有正确渲染。请告诉我我在哪里失踪了。 小提琴设置在

Jquery代码如下

$(function() {
var projects = [
    {
        "label": "ajax",
        "value": "1003",
        "desc": "foriegn"
    },
    {
        "label": "jquery",
        "value": "1000",
        "desc": "dd"
    },
    {
        "label": "wordpress theme",
        "value": "1000",
        "desc": "h"
    },
    {
        "label": "xml",
        "value": "1000",
        "desc": "j"
    }];

$("#addButton");
var counter = 13;

$("#addButton").click(function() {
    var newTextBoxDiv = $(document.createElement('div'))
            .attr("id", 'TextBoxDiv' + counter);

    var roleInput = $('<input/>', {
        type: 'text',
        placeholder: 'Role',
        name: 'Role' + counter,
        id: 'project-description' + counter
    });

    var searchInput = $('<input/>', {
        type: 'text',
        placeholder: 'search',
        name: 'search' + counter,
        id: 'project' + counter
    });

    var hidd = $('<input/>', {
        type: 'hidden',
        name: 'searchhid' + counter,
        id: 'project-id' + counter
    });


    newTextBoxDiv.append(roleInput).append(searchInput).append(hidd);
    newTextBoxDiv.appendTo("#TextBoxesGroup");
    $("#project" + counter).autocomplete({
        minLength: 0,
        source: projects,
        focus: function(event, ui) {
            $("#project" + counter).val(ui.item.label);
            return false;
        },
        select: function(event, ui) {
            $("#project" + counter).val(ui.item.label);
            $("#project-id" + counter).val(ui.item.value);
            $("#project-description" + counter).val(ui.item.value);
            $("#project-icon" + counter).attr("src", "images/" + ui.item.icon);
            return false;
        }
    })


    counter++;
});

});

$（函数（）{
var项目=[
{
“标签”：“ajax”，
“值”：“1003”，
“描述”：“外国”
},
{
“标签”：“jquery”，
“值”：“1000”，
“描述”：“描述”
},
{
“标签”：“wordpress主题”，
“值”：“1000”，
“描述”：“h”
},
{
“标签”：“xml”，
“值”：“1000”，
“描述”：“j”
}];
$（“添加按钮”）；
var计数器=13；
$（“#添加按钮”）。单击（函数（）{
var newTextBoxDiv=$（document.createElement（'div'））
.attr（“id”，“TextBoxDiv”+计数器）；
变量roleInput=$（''{
键入：“文本”，
占位符：“角色”，
名称：'角色'+计数器，
id:“项目说明”+计数器
});
var searchInput=$（''{
键入：“文本”，
占位符：“搜索”，
名称：'搜索'+计数器，
id:'项目'+计数器
});
变量hidd=$（''{
键入：“隐藏”，
名称：'searchhid'+计数器，
id:'项目id'+计数器
});
newTextBoxDiv.append（roleInput）.append（searchInput）.append（hidd）；
newTextBoxDiv.appendTo（“#textboxsgroup”）；
$（“#项目”+计数器）。自动完成({
最小长度：0，
资料来源：项目，
焦点：功能（事件、用户界面）{
$（“#项目”+计数器）.val（ui.item.label）；
返回false；
},
选择：功能（事件、用户界面）{
$（“#项目”+计数器）.val（ui.item.label）；
$（“#项目id”+计数器）.val（ui.item.value）；
$（“#项目描述”+计数器）.val（ui.item.value）；
$（“#项目图标”+计数器）.attr（“src”，“images/”+ui.item.icon）；
返回false；
}
})
计数器++；
});
});

html代码：

<div id="project-label"></div>

<input type="hidden" id="project-id" />



 <div id='TextBoxesGroup'>
 <div id="TextBoxDiv1" class="form-inline control-group">

 </div>
</div>
 <input type='button' value='Add' id='addButton' />

---

我已经更新了您的小提琴，它正在工作，问题在于您的计数器变量从未递增，因为您在脚本末尾有place，但在它上面有return语句

你的小提琴在这儿

---

但在一开始递增计数器将无法使用正确的逻辑。因为，如果您已经添加了10个新行，并且如果您在第一个自动完成中开始搜索，那么结果将在最近添加的行中呈现。

var counter = 0;
$("#addButton").click(function() {
    counter++;