javascript - 如何附加 jquery ui 自动完成元素？

Question

我想知道如何在页面处于事件状态时附加 jquery ui 自动完成元素。

想法是有两个元素，我想在按下提交按钮后添加第三个元素。

这是我的代码:

$(function() {
    var projects = [{
            value: '123',
            label: 'Element 1',
            desc: 'Element 1 Description',
            icon: 'element1icon.png'
        },{
            value: '456',
            label: 'Element 2',
            desc: 'Element 2 Description',
            icon: 'element2icon.png'
        }
    ,];

    $("#desc1").autocomplete({
        minLength: 0,
        source: projects,
        focus: function(event, ui) {
            $("#desc1").val(ui.item.label);
            return false;
        },
        select: function(event, ui) {
            $("#desc1").val(ui.item.label);
            $("#desc-id1").val(ui.item.value);

            return false;
        }
    })
    .data('ui-autocomplete')._renderItem = function(ul, item) {
        return $('<li>')
        .append('<a>' + item.label + '<br>' + item.desc + '</a>')
        .appendTo(ul);
    };
});

$( "#submit" ).click(function() {
    var itemtoadd = $("#addelementtext").val();
    alert("This action should insert the element " + itemtoadd);
});

HERE IS THE FIDDLE

编辑:

想法是旧文本框与新元素 ELEMENT 3 一起出现，就好像它是这样声明的:

var projects = [{
            value: '123',
            label: 'Element 1',
            desc: 'Element 1 Description',
            icon: 'element1icon.png'
        },{
            value: '456',
            label: 'Element 2',
            desc: 'Element 2 Description',
            icon: 'element2icon.png'
        },{
            value: '789',
            label: 'Element 3',
            desc: 'Elemen 3 Description',
            icon: 'element3icon.png'
        },

    ,]; 

Answer 1

在按钮前添加:

$('#submit').before('<input type="text" value="test" />');

http://jsfiddle.net/2GvuB/1/