JQuery Facebook like AutoSuggest déclenché par "@"

Question

Je suis à la recherche d'un plugin JQuery (ou autre framework), fonctionnant comme la zone de texte du message d'état Facebook.

ce qu'il doit faire:

• Autoriser le texte à être librement tapé sans déclencher l'AutoSuggest (par opposition aux boîtes de AutoSuggest normales)

• Afficher la AutoSuggest, lorsqu'elle est déclenchée par un certain caractère, tel que '@'.

En fait, il devrait fonctionner exactement comme celui de FaceBook ... :)

Answer 1

Je voudrais utiliser quelque chose comme ceci: http://www.codeproject.com/KB/aspnet/Search_SuggestTextBox.aspx

La bonne chose à propos de cette bibliothèque est qu'il est déclenché par l'entrée de texte onkeyup. Cela signifie que vous pouvez modifier leur fonction JS fourni pour vérifier la séquence de touches correcte

Peut-être quelque chose comme ceci:

var shiftDown=false; //Track if SHIFT was the last key pressed. 

function searchSuggest(e) 
{ 
    var key = window.event ? e.keyCode : e.which; 

    if (key==40 || key==38) 
    { 
     shiftDown=false; 
     scrolldiv(key); 
    } 
    else if (key == 16) // SHIFT WAS PRESSED 
    { 
     shiftDown=true; 
    } 
    else if (key == 50 && shiftDown) // 2 WAS PRESSED 
    { 
     if (searchReq.readyState == 4 || searchReq.readyState == 0) 
     { 
      var str = escape(document.getElementById('txtSearch').value); 
      strOriginal=str; 
      searchReq.open("GET", 'Result.aspx?search=' + str, true); 
      searchReq.onreadystatechange = handleSearchSuggest; 
      searchReq.send(null); 
      shiftDown=false; 
     } 
    } 
    else 
    { 
     shiftDown=false; 
    } 
} 

Answer 2

Espérons maintenant que vous (OP) ont été en mesure d'utiliser la réponse de Dutchie432 pour créer une solution que vous êtes content. Mais si vous, ou toute autre personne qui tombe par hasard sur ce point, n'avez pas, ou avez et êtes peut-être à la recherche d'une solution robuste prête à l'emploi ...

... On dirait que Mentionator est exactement ce que vous cherchez: c'est un plugin jQuery qui permet aux clients de créer des références surlignées ("mentions") à des entités prédéfinies dans des zones de texte. Il est maintenu par ce type ici :).

Contrairement à des plug-ins similaires, Mentionator propose les options suivantes qui fournit des options qui, comme vous avez demandé, lui permettent de fonctionner exactement comme l'installation de marquage Facebook:

doesRecognizeDelimitedSubstrings: 
    A boolean which, if defined as true, will allow the external value 
    of a mention, herein called "mentionExternalValue", to sustain 
    modifications so long as the result of each such modification 
    is in mentionExternalValue.split(delimValue) 

delimValue: 
    A string, or regular expression representing the set of strings, 
    that, given doesRecognizeDelimitedSubstrings === true, delimit 
    mentionExternalValue substrings that can also serve as external 
    value of the mention if yielded by a modification of 
    mentionExternalValue