2012-09-28 84 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/

相關問題