jQuery-UI выбирается на входе

Question

Пожалуйста, перейдите по этой ссылке: FIDDLE

Я создаю этот вход (это инструмент поиска) и добавляю несколько «подсказок» для выбора.

Я использую скрытый абзац, чтобы лучше его сохранить.

У меня 2 проблемы:

1. Если вы попытаетесь выбрать 3 подсказки и чтобы отменить выбор, вы увидите, что скрытый текст пуст, но на входе выбраны последние подсказки.
2. Мне бы хотелось, чтобы, если я вручную набрал "Hello world" и затем использовал подсказки, Hello world остался там всегда, даже если я удалю все подсказки, чем.

Заранее благодарю за помощь.

Answer 1

для первого вопроса, попробуйте этот код

$(document).ready(function() {
    var lista = $('ul#common-list');
    lista.bind("mousedown", function (e) {
        e.metaKey = true;
    }).selectable({
        stop: function () {
            var result = $("input#search");
            var fakeText = $('p.hidden-tips-text').empty();
            $(".ui-selected", this).each(function () {
                var index = $(this).text();
                fakeText.append((index) + " ");
            });
           result.val(fakeText.text());
        }
    });
});