自动填充功能未被选中

时间:2013-11-15 10:55:25

标签: javascript jquery

自动填充搜索框的数量是基于#AddButton的动态。自动完成功能正常,但是当我选择值时,它无法正确呈现。请告诉我我错过了哪里。 小提琴设置位于http://jsfiddle.net/jakenrush/kELm3/1/

下面的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++;
});

});

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' />

1 个答案:

答案 0 :(得分:0)

我已经更新了你的小提琴并且它正在工作,问题在于你的计数器变量从未增加,因为你已经放在脚本的末尾,但是你上面有返回语句。

你的小提琴http://jsfiddle.net/kELm3/6/

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