Javascript 突出显示自动完成输入框中的第一个单词

我有一个应用程序，用户键入一个单词，就会出现自动完成。当选择适当的自动完成时，它将被添加到

输入

字段，用户将继续键入。我非常希望在输入框中突出显示该单词（不在自动完成列表中），并使框中的其余单词不突出显示，但我找不到任何此类示例

$(searchBoxId).autocomplete({
    source:      keys,
    delay:       0,
    selectFirst: true,
    select:      function(event, ui) {
        var TABKEY = 9;
        this.value = ui.item.value;

        if (event.keyCode == TABKEY) {
            event.preventDefault();
            this.value = this.value + " ";
            // XXX something goes here?
            this.focus();
        }

        return false;
    },
    autoFocus: true,
    minLength: 2
});

---

这是jquery1.8.20。所谓“突出显示”，我的意思是“能够以类似于Facebook或Google+突出显示用户名的方式使其在视觉上清晰可见”。

既然您已经在使用jQuery，您可能希望使用类似的方式

它支持自动完成，并能实现您想要的数据差异化

基本概念是将文本框设为div，并设置

contenteditable

标志。收听

keypress

事件，特别是空格键和回车键。当它们被点击时，您抓取最近输入的文本（已经没有“标记”）并创建一个

并附加它

---

或者只使用插件…

可能重复或可能标记，不幸的是，两者都不是重复的。第一个将原始HTML嵌入到输入字段中，第二个选择输入字段中的文本。不过，谢谢你的指点。我认为除了这两种选择之外，你不会找到其他方法。另一个“选项”是在文本输入上分层一个div，并通过环绕要高亮显示的文本的方式高亮显示，但这不是您所要求的。