Como bloquear a tecla Backspace com JQuery

Antes de postar o código, é preciso falar sobre o evento que usaremos.
Temos como opção trabalhar com os eventos do teclado: keypress, keyup e keydown.
Teoricamente poderíamos usar qualquer um destes eventos, isso claro se não tivéssemos as tão queridas incompatibilidades entre navegadores. Mostrarei abaixo algumas propriedades dos eventos de teclado nos navegadores: Chrome, Firefox e IE 8, para que todos vejam que ao implementar determinada funcionalidade com algum destes eventos, é necessário verificar a compatibilidade com cada navegador.

Google Crhome 21.0.1180.89 m >

keydown
keyCode is 8
charCode is 0

keyup
keyCode is 8
charCode is 0

IE 8 >

keydown
keyCode is 8
charCode is undefined

keyup
keyCode is 8
charCode is undefined

Firefox 15.0.1 >

keydown
keyCode is 8
charCode is 0

keypress
keyCode is 8
charCode is 0

keyup
keyCode is 8
charCode is 0
Podemos ver que o evento keypress só é compatível com Firefox.
Após sabermos qual evento utilizar e qual código da tecla (ver tabela ASCII)  queremos trabalhar, vamos a implementação:

 

/**Bloqueia o evento keydown para a tecla backspace em todo o documento**/
	function backspaceBlock(){
		$(document).unbind('keydown').bind('keydown',function(e){
			if(e.keyCode == 8){
				return false;
			}
		});	
 
	}

Desta forma bloquearemos a tecla backspace assim que chamarmos a função backspaceBlock(). E podemos ainda aproveitar esta estrutura para fazer a função que desbloqueia a tecla backspace, assim podemos mandar bloquear e desbloquear quando quisermos.

	/**Desbloqueia o evento keydown para a tecla Backspace **/
	function backspaceUnlock(){
		$(document).unbind('keydown').bind('keydown',function(e){
			if(e.keyCode == 8){
				return true;
			}
		});			
	}

Lembrando que esta não é a unica forma de se fazer, mas com estas informações fique mais claro o caminho.

Obrigado pela leitura.

Deixe uma resposta

%d blogueiros gostam disto: