jQuery plugin onKeyEnter, ejecutar un callback al teclear Enter
January 24th, 2011 by pako received No Comments »onKeyEnter, es un mini-plugin de JQuery sive para ejecutar una función cuando se tecleé un Enter, esto es algo sencillo de lograr con jQuery, pero aquí lo encapsulo en un plugin para que aun sea un poco mas sencillo
para realizar esta función en jQuery debemos de hacer algo así
$(".unInputText").keydown(function(e){
if(e.keyCode == 13){
alert("diste Enter");
//Aki código a ejecutar
}
})
es sencillo si solo se desea hacer en un control, pero si son varios el pequeño if(e.keyCode==13) se puede volver repetitivo, para no tener que repetir esta pequeña porción de código envolví esta función en este miniplugin
/*
fcodiaz@devtics.com.mx
24/01/2011
www.devtics.com.mx
MIT/GNU
*/
/*keyEnter*/
(function($){
$.fn.onKeyEnter=function(callback){
var $this=$(this)
$this.keydown(function(e){
if(e.keyCode == 13){
return callback.call(this,e);
}
})
return $this;
}
})(jQuery);
por lo que una vez que tengas el plugin disponible podrás realizar esto:
$(".unInputText").onKeyEnter(function(e){
alert("diste Enter");
});
ademas se puede consumir el evento retornando un false desde la callback, con esto puedes cancelar por ejemplo el envió de un form.
el callback se ejecutara en contexto del elemento seleccionado, por lo que al hacer referencia a this dentro del callback haces referencia al elemento donde se recibió el enter, se recibe un único parámetro que es el objeto Event
El plugin es muy pequeño así que no dejo archivo .js en lugar de esto copia el código del plugin y pegalo ya sea al final de tu librería de jQuery o en alguna otra que utilices dentro de la pagina donde quieras usarlo, solo recuerda colocarlo después de la librería de JQuery
Posted under: JavaScript, jQuery, jQuery Plugins
