Estou desenvolvendo um formulário e usando o preenchimento automático da interface do usuário do jQuery. Quando o usuário seleciona uma opção, desejo que a seleção apareça em um período anexado ao pai<p> etiqueta, rótulo, palavra-chave. Quero que o campo seja limpo em vez de preenchido com a seleção.

O intervalo está aparecendo muito bem, mas não consigo limpar o campo.

Como você cancela a ação de seleção padrão do preenchimento automático da interface do usuário do jQuery?

Aqui está o meu código:

var availableTags = ["cheese", "milk", "dairy", "meat", "vegetables", "fruit", "grains"];
$("[id^=item-tag-]").autocomplete({
    source: availableTags,

    select: function(){
        var newTag = $(this).val();
        $(this).val("");
        $(this).parent().append("<span>" + newTag + "<a href=\"#\">[x]</a> </span>");
    }
});

Simplesmente fazendo$(this).val(""); não funciona O que é enlouquecedor é que quase a função exata funciona bem se eu ignorar o preenchimento automático e apenas tomar uma ação quando o usuário digitar uma vírgula como tal:

$('[id^=item-tag-]').keyup(function(e) {
    if(e.keyCode == 188) {
        var newTag = $(this).val().slice(0,-1);
        $(this).val('');
        $(this).parent().append("<span>" + newTag + "<a href=\"#\">[x]</a> </span>");
    }
});

O resultado final real é o preenchimento automático para trabalhar com várias seleções. Se alguém tiver alguma sugestão para isso, seria bem-vindo.