Qual a diferença entre os eventos onkeypress, onkeyup e onkeydown?

Muitas vezes os eventos onkeypress, onkeyup e onkeydown são utilizados para o mesmo fim: receber os eventos do teclado. Entretanto existem algumas diferenças básicas no funcionamento deles.

A diferença primordial entre eles é relacionado a quando os eventos são disparados. O onkeydown é disparado assim que a tecla é pressionada, sendo assim o primeiro entre os eventos a ser disparado. Em seguida é a vez do onkeypress e por último, quando a tecla é solta, o evento onkeyup é executado.

Outra diferença fundamental é que nem todas as teclas são tratadas em todos os navegadores no onkeypress. Em geral ele se limita apenas em disparar eventos quando a tecla, única, gerar algum caractere ASCII, fazendo com que ALT, CTRL e Backspace por exemplo, não disparem eventos. Por outro lado, qualquer tecla gera evento tanto em onkeypress quanto em onkeydown, desde que respeitados sua definição, conforme parágrafo anterior.

Há ainda a possibilidade de o teclado ficar com uma mesma tecla pressionada pelo usuário. Nesse caso, o evento onkeyup, seguindo sua própria definição, só será disparado na hora em que houver o evento de soltar a tecla, ao contrário de onkeypress e onkeydown, a cada novo caractere que for gerado num campo texto será disparado o evento – se essa tecla gerar algum caractere ASCII. Caso contrário, apenas o evento onkeydown será chamado.

Evento Ordem de disparo Caractreres ASCII Teclas não-ascii Tecla mantida pressionada
onkeydown 1 Sim Sim N ocorrências
onkeypress 2 Sim Não N ocorrências
onkeyup 3 Sim Sim 1 ocorrência

Função trim em javascript

A função trim é muito utilizada para tratar strings em várias linguagens, entretanto não há implementação padrão em Javascript.

Essa função consiste em retirar alguns caracteres (normalmente os espaços em branco, quebras de linha ou outros caracteres relevantes) do início e do fim da string, com a finalidade de torná-la limpa.

O trim recebe dois parâmetros normalmente, o primeiro com a string a ser tratada e o segundo com os caracteres que serão removidos dos extremos, concatenados. Segue abaixo a implementação em Javascript:

function trim(entrada, indesejados){
	var i, retorno;
	retorno = entrada;
	var cortePadrao = " \n\t\r";
	if (typeof(indesejados)=='undefined' || indesejados =='') {
		indesejados = cortePadrao;
	} else {
		indesejados += cortePadrao;
	}
 
	//limpando o início
    for (i = 0; i < retorno.length; i++) {
        if (indesejados.indexOf(retorno.charAt(i)) === -1) {
            retorno = retorno.substring(i);
            break;
        }
    }
 
	//limpando o fim
    for (i = (retorno.length - 1); i >= 0; i--) {
        if (indesejados.indexOf(retorno.charAt(i)) === -1) {
            retorno = retorno.substring(0, i + 1);
            break;
        }
    }
	return retorno;
}

Outra opção é a utilização de uma expressão regular apenas para tirar espaços em branco e afins das beiradas da string. Nesse caso o javascript ficaria bem mais simples:

function trim(str) {
	return str.replace(/^\s+|\s+$/g,"");
}

Vale lembrar que se você estiver com a biblioteca do jQuery carregada por exemplo, a implementação já existe: jQuery.trim(str). Além disso alguns navegadores que implementam versões mais recentes do javascript possuem a função nativa. Entretanto contar com esse suporte faria seu site não ser funcional para uma parcela significativa dos usuários.