Detectar el carácter ingresado con JavaScript

Question

Me gustaría iniciar una acción (habilitando autocompletar) cuando el usuario escribe '@'. Sin embargo, no sé cómo hacerlo correctamente. Tengo jQuery disponible.

Por lo general, en un teclado QWERTY, que es la siguiente:

$('textarea').live('keydown', function(e) { 
    if (e.which === 50) { 
    console.log('@ has been entered.'); 
    } 
}); 

Sin embargo, no funciona correctamente en un teclado AZERTY. El código clave = 50 corresponde a la clave é~/2. Para escribir '@' en el teclado AZERTY, es la tecla AltGr + à@/0.

Editar: No estaba claro. Autocompletar comienza cuando se ingresa @, y solo después de eso. Por ejemplo, cuando alguien ingresa "Hello @" comienza, sin embargo, cuando escribe "Hello @nothing else", el mensaje completo no hará nada. Ejemplo: http://mrkipling.github.com/jQuery-at-username/ (funciona solo en el teclado QWERTY).

Answer 1

Uso keypress en lugar de keydown. Mientras keydown se relaciona con cada pulsación de una tecla, keypress se relaciona con los caracteres traducidos, por ejemplo a puede ser diferente a a mientras se presiona la tecla Mayús, los caracteres compuestos funcionan, funcionan las teclas muertas y se manejan otras diferencias en las asignaciones del teclado .

Answer 2

La única otra opción que se le viene a la mente sería un temporizador que verifica el contenido de la entrada de texto.

var patt=new RegExp(/^@/); 
var charCheck = setInterval(function(){ 
    if (patt.test($("#textInput").val())){ 
    // initiate autocomplete 
    } 
},100); 

Este código inspeccionará el contenido del elemento #textInput y ver si coincide con la expresión regular de un símbolo @ en el principio de la cadena. Si lo hace, la función test() se evaluará como verdadera y podrá iniciar su código de autocompletar.

Answer 3

¿Qué tal si se ingresara @ como el último carácter en el valor del campo?

$("body").on("keyup", "textarea", function(e) { 
    if (this.value.indexOf("@") == this.value.length - 1) { 
     console.log("Starting autocomplete"); 
    } 
});​ 

DEMO:http://jsfiddle.net/FKhPW/2/

Answer 4

Aquí tiene demostración de trabajo:http://jsfiddle.net/LxpQQ/

de mi viejo respuesta aquí:

jquery autocomplete using '@'

espero que se ajuste a usted causa :)

código

source: function(request, response) { 
      if (request.term.indexOf("@") >= 0) { 
       $("#loading").show(); 
       getTags(extractLast(request.term), function(data) { 
        response($.map(data.tags, function(el) { 
         return { 
          value: el.name, 
          count: el.count 
         } 
        })); 
        $("#loading").hide();      
       }); 
      } 
     }, 

Answer 5

Utilice event.key y JS moderno, buscando @ directamente!

No hay códigos de número más. Puede verificar la clave directamente.

const input = document.getElementById("textarea"); 
input.addEventListener("keydown", function (event) { 
    if (event.key === "@") { 
     // Do something 
    } 
}); 

Mozilla Docs

Supported Browsers