2012-09-28 56 views
2

我使用autocompleteTrigger http://jsfiddle.net/dmattes/2YRgW/1/JQuery的自动完成 - 选择项目并改变其颜色

是否可以选择它后颜色标签?在自动完成文本的

例子: 我和安娜前往@barcelona 巴塞罗那的颜色应

亲切的问候, 迪马

+0

除非你打算*是非常狡猾的*。问题在于你想要改变的那一段字符串实际上被表示为输入内的一个值。你的任务,如果你选择接受它,就是在':select(event,ui)'上,附加一个绝对位于其上的div,将值传递给div,移除'ui.label'并测试字符串出现'\ @ [a-Z0-9]'。然后,如果我们有匹配,我们需要在匹配上拆分字符串,应用适当的元素和样式来包装它,重建字符串,然后将其附加到新创建的div。 – Ohgodwhy

+0

当点击div时,必须在输入上调用一个'focus()',在点击的时候,还必须用我们放入div的文本填充输入值。这里的问题在于,我们必须在发回数据时对数据进行清理,以免我们的输入val中出现'html标记。也就是说,除非你不关心他们再次搜索什么。 – Ohgodwhy

+0

嗯,那你准确的建议是什么?如何做呢 ? (脸谱正在这样做..) – sallaboy

回答

0

您可以在我的jsfiddle看认为这是你正在寻找的东西。

http://jsfiddle.net/2YRgW/191/

JS

$('input,textarea').autocompleteTrigger({ 
    triggerStart : '@', 
    triggerEnd: '', 
    source: [ 
     "Asp", 
     "BASIC", 
     "COBOL", 
     "ColdFusion", 
     "Erlang", 
     "Fortran", 
     "Groovy", 
     "Java", 
     "JavaScript", 
     "Lisp", 
     "Perl", 
     "PHP", 
     "Python", 
     "Ruby", 
     "Scala", 
     "Scheme" 
    ] 
}); 
$('input,textarea').autocomplete({ 
    select: function(event, ui){ 
     $('.text2').html(ui.item.value); 
     $('.text2').css("background-color","green"); 
    } 
}); 
​ 

HTML

<h2>Textfield</h2> 
<input type='text' /> 

<div>&nbsp;</div> 

<h2>Textarea</h2> 
<textarea class="text2" col="50" row="3"></textarea> 

编辑:

我看到你要的文字颜色改变,盒子没有色彩。我改变了提琴手。

http://jsfiddle.net/2YRgW/192/