caps-lock detectie
zorg dat jouw bezoekers geen verkeerde invoer kunnen intoetsen

home | index | menu | help

Er is geen CSS ondersteuning.

		
		
  
		
		

Soms zijn het hele kleine dingen die het leven van jouw bezoekers wat aangenamer kunnen maken. Het kan nog wel eens gebeuren dat per ongeluk (of natuurlijk ook doelbewust) de caps-lock aanstaat. En als er dan iets in een input-veld moet worden getikt, terwijl je geen hoofdletters kan (of mag) gebruiken (in dit voorbeeld wordt een pass-woord-invoer gesimuleerd), kom je daar pas achter als er gevalideerd wordt nadat het veld helemaal ingevuld is. Deze kleine procedure reageert (onmiddelijk) al bij de eerste letter van de invoer. Ik zet hieronder het stukje "form" en de paar regels javascript die de check op de caps lock uitvoeren.

<form>
	<label for="geeffocus">caps lock check</label>
	<input type="password" id="geeffocus" name="geeffocus" onKeyPress="check_capslock(event)">  
	<input type="reset" value="clear">
</form>	 
		
<script> 	
	function check_capslock(e){
		var toetscode=0;
		var detoets=true;
		if(document.all){
			toetscode=e.keyCode;	
			detoets=e.shiftKey;}
		else if(document.getElementById){
			toetscode=e.which;
			detoets=(toetscode==16)?true:false;}
		if((toetscode>=65&&toetscode<=90)&& !detoets){
		alert('Caps Lock staat aan');return false;}}
	document.getElementById('geeffocus').focus();
</script>
		
		

cache 20-09-2010