jQuery自动填充多个值和图标（电子邮件到字段）

Question

我想创建一个使用jQuery自动填充字段进行查找的窗体上的收件人字段。我希望这是允许多个值。我已经知道如何做到这一点。

当添加收件人并使用自动完成执行查找时，收件人姓名应该有一个蓝色背景，旁边有一个删除图标（x），类似于“收件人”字段iPhone或Facebook中的人物查找（例如，在FB中创建新组时）

任何想法欢迎！

感谢您的时间， 阿尔伯特

Answer 1

所有你需要明白，你想做的事是默认不可用的功能只有一个HTML元素（在这种情况下输入）的第一个。

我不会输入很多技术细节，因为这意味着喂匙子，我宁愿让您指出正确的方向;希望你不介意，在这里它：

冷杉你需要有一个容器，看起来像块，让我们说一个div。里面的它，你将有哪些应该只是一个容器的一部分，这样的输入域：

<div id="tag_editor"> 
    <span id="tokens"><!-- js stores tags here --></span> 
    <input type="text" id="tag_editor_input"> 
</div> 

一旦你写上输入一些文字，自动完成应正常显示。但是，您需要一个钩子，以便在您不专心或单击建议时将输入内容转换为显示数据的HTML元素，则应将其存储在标记容器中。

当然的输入框中将是相同的，但它会向右移动，例如：

一旦你做到了这一点，你应该能够添加尽可能多的标签如所须。然后，当您需要获取数据时，只需遍历#tokens的内容并将其用作数据的一部分。

希望它有帮助。