Mauricio Junior
Tecla ESC na tela WEB
Funcionalidade perfeita para o sistema completo pelo browser
Caro leitor(a), gostaria de informar e mostrar hoje como deixar a sua tela WEB configurada para fechar automaticamente quando for clicado a tecla ESC do teclado.
Usado: HTML, JavaScript, Visual Studio 2010, Plataforma ASP.NET.
Muitas empresas estĂŁo acostumadas em clicar ESC para sair da tela do sistema desktop. O problema de hoje Ă© que a maioria dos aplicativos sĂŁo do tipo web ou usa a plataforma ASP.NET.
O legal Ă© que o comando Ă© simples e fĂĄcil de colocar em qualquer pĂĄgina âPopUpâ do seu sistema. O primeiro de tudo Ă© colocar a tag <body> na pĂĄgina âPopUpâ com a propriedade âonkeydownâ ativada.
VocĂȘ precisa identificar a tecla KeyCode antes de tudo. (Code 1)
|
switch (event.keyCode) { case SAIR: //Tecla ESC para sair do Sistema SairSistema(); break; default: //Default e a respota SIM break; }
|
Note que o comando switch verificar o evento keyCode. Esse evento KeyCode retona um valor em nĂșmero. Depois verifiquei se Ă© igual ao SAIR registrado anteriormente. Caso for igual ele chama outra função chamada SairSistema().
A função SairSistema() chamada apenas o comando Window.Close(). Code 2.
|
function SairSistema() { window.close(); }
|
Ă importante dizer que a tecla ESC equivale ao nĂșmero 27 e a tecla ENTER equivale ao valor 13. No topo do JavaScript coloquei algumas constantes com o nĂșmero de cada tecla. (Code 3).
|
//VariĂĄveis globais var ENTER = 13; //Tecla Enter para executar var SAIR = 27; //Tecla ESC
|
Em alguns casos, usei o try catch para facilitar a vida do usuårio no caso de qualquer erro. No body, coloquei o nome da função. (Code 4)
|
<script type="text/javascript"> //VariĂĄveis globais var ENTER = 13; //Tecla Enter para executar var SAIR = 27; //Tecla ESC
//pegar a tecla function GetKeyPress() { try { switch (event.keyCode) { case SAIR: //Tecla ESC para sair do Sistema SairSistema(); break; default: //Default e a respota SIM break; } } catch (e) { window.close(); }
}
//sair do sistema function SairSistema() { try { window.close(); } catch (e) { window.close(); } } </script>
|
Após colocar as funçÔes dentro da pågina, basta chamar na propriedade onkeydown. (Code 5).
|
<body onkeydown="GetKeyPress()"></body>
|
Com essa propriedade chamando a função, se a tecla for clicada, a pågina vai fechar sem perguntar nada. Cuidado no momento que for colocar isso junto do seu sistema. Muitas pessoas não sabem fazer isso, por isso é legal colocar uma mensagem perguntando se realmente quer fechar a tela.
Para colocar a mensagem, basta acrescentar o seguinte código. Só alterei o método principal GetKeyPress. (Code 6).
|
//pegar a tecla function GetKeyPress() { try { switch (event.keyCode) { case SAIR: //Tecla ESC para sair do Sistema if(confirm('Deseja sair da pĂĄgina?')) SairSistema(); break; default: //Default e a respota SIM break; } } catch (e) { window.close(); }
}
|
Veja a imagem abaixo. (Image 1)
Image 1
Note que a linha acrescentada foi o if(confirm(âDeseja sair da pagina?â)). Todo esse artigo foi testado no Firefox e IE, funcionou perfeitamente. Bom, espero que tenha te ajudado e qualquer problema pode entrar em contato.
Subscribe ecode10.com
Receive our latest updates about programming languages, software, database, books, ebooks, classes, jobs and more.
You can cancel anytime.
Log In
