使用 jquery，如何像 Live Mail 处理电子邮件地址一样处理标签？

发布于 2024-07-16 11:00:11 字数 354 浏览 7 评论 0原文

我需要一个类似标签的系统，其操作方式与 Live Mail 处理电子邮件地址的方式非常相似。

对于那些不知道的人，Live Mail 提供了一个文本框，您可以在其中输入电子邮件地址。当您完成电子邮件地址的输入后，Live Mail 会将地址从纯文本更改为具有边框且内部包含文本的 div。如果您想删除该地址，请将鼠标悬停在该地址上，右侧会出现一个十字。地址被“标记”后就无法更改。如果要更改它，则需要将其删除并重新添加。

这是我需要的功能，只不过我将使用标签而不是电子邮件地址来执行此操作。

我想知道是否有人知道以这种方式工作的 jquery 组件。

干杯，安东尼

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

浅沫记忆 2024-07-23 11:00:11

jquery facebook 自动完成（通过 Ajaxian)

有一本关于 Jquery 1.6 UI，具有电子邮件自动完成功能以及自动完成功能的最后一个示例（图书源代码）。

回复收藏 0 原文

海夕 2024-07-23 11:00:11

我从未听说过这样的 JQuery 插件，但自己完成应该不会太难。然而，为了实现实际的外观，当然需要一些关于 CSS 的知识。

// Code for replacing a textbox with a DIV on blur.
$('#textbox').blur(function () {
  var content = $(this).val();
  if (!content) return; // Don't make anything out of empty textboxes.
  // Create a DIV and make it a sibling to the textbox.
  $('<div>').html(content).appendTo($(this).parent());
  // Remove the textbox.
  $(this).remove();
});

顺便说一句，我还没有测试过这些，但这应该会让你走上正轨。

哈！

I never heard of such a JQuery plugin, but it shouldn't be too hard to accomplish on your own. However, it will require some knowledge about CSS for the actual looks of course.

// Code for replacing a textbox with a DIV on blur.
$('#textbox').blur(function () {
  var content = $(this).val();
  if (!content) return; // Don't make anything out of empty textboxes.
  // Create a DIV and make it a sibling to the textbox.
  $('<div>').html(content).appendTo($(this).parent());
  // Remove the textbox.
  $(this).remove();
});

I haven't tested any of this by the way, but this should get you on the right track.

HTH!

回复收藏 0 原文

~没有更多了~