javascript - 使用删除选项作为 x 过滤一个输入多个值

Question

我在互联网上搜索，要么我不知道到底要寻找什么，要么不支持这种类型。

我需要使用 js 和 jquery 为我在 html 中的过滤实现以下输入。这与 stackoverflows 标签输入完全一样。在空格后在末尾添加 x。

有人知道怎么做吗？有人可以给我一些样品吗？

对不起，现在我意识到我没有很好地表达自己。我不需要自动完成，只需使用删除选项添加多个标签，因为 x 仅由空格分隔

Answer 1

HTML：

<div class='container'>
<div class='selectedElements'></div>
<input type='text' id='useToSelect' value='' onkeyup="testForSpace();">
</div>

查询：

function testForSpace()
{
    text=$('#useToSelect').val();
    if (text[text.length-1] == ' ') {
        if (text == '') {
            $("#useToSelect").val("");   
        }
    currentSelected=$(".selectedElements").html();
    newSelected="<div class='singleSelectedContainer' onclick='destroyElement(this)' style='float:left;'><div class='singleSelected'><div class='Content'>" + text + "</div><div class='Close'> &nbsp;  x </div><div clear:left;></div></div><div style='float:left; width:7px;'>&nbsp;</div></div>";
    $(".selectedElements").html(currentSelected + newSelected);
    $("#useToSelect").val("");
    }
 }


function destroyElement(elem) {
    $(elem).html('');   
}

在输入字段中键入内容并按空格后，它会生成一个包含您的文本的 div，并将其放在输入的左侧。如果这是您正在寻找的，并且需要更多解释，我很乐意向您解释这是如何工作的。

function retrieveData() 
{ 
  dataArray=new Array(); 
  $(".singleSelected").each(function() {
    dataArray.push($(this .Content).html());
  });
  return dataArray; //this contains the selected elements 
}