电子邮件地址，如hotmail

Question

我不知道这叫什么，因此很难在网上找到任何参考资料。在hotmail上输入电子邮件时，它会将电子邮件一个接一个地放在同一行的rectange块中，并带有编辑和删除电子邮件的选项。这是什么以及是否有任何示例代码/框架来实现类似的东西？

感谢。

Answer 1

通常是UL，在其中你有LI个元素，这些元素的样式是围绕它们设置了一个框（在您的情况下是电子邮件），或者是无边框INPUT框它融入相同背景的周围UL。 JavaScript代码根据键盘输入处理框LI的删除和插入。我不知道它的框架支持，但它可能存在。

编辑：它存在。 http://plugins.jquery.com/plugin-tags/tags用于jQuery选项。

Answer 2

我正在寻找相同的东西，并查看它的源代码。他们似乎正在使用像Amadan这样的UL，但它的设置如下：

<div id="container">
    <ul id="email_list">
       <li class="email_token valid" id="a@a.com" email="a@a.com">
            <p>a@a.com</p>
            <span class="delete_link">x</span>
       </li>
       <li class="email_token valid" id="b@b.com" email="b@b.com">
            <p>b@b.com</p>
            <span class="delete_link">x</span>
       </li>
       <li class="email_input_container">
            <textarea class="email_input_field"></textarea>
       </li>
    </ul>
</div>

编辑：我最终实现了它并且运行得非常好！

Answer 3

尝试使用Firefox + Firebug来检查hotmail中的元素。它会帮助你找到自己。