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/

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

1 个答案: