onblur,onkeypress,onkeyup,onkeydown

[napsternapster]

Hi,

I'm creating a dynamic site but now I'm coming across a problem when I'm displaying input textbox.The textboxes uses two events onblur and onkeypress
These two events they invoke the same function which suppose to determine the function must be executed between Shownext() and tabbackorFront()

When a use uses tab key to go or display the next select dropdown it functions well ut when the user clicks tab+ctrl to go back the function that is called is the onblur instead of the onkeypress.

What I need is the way at which the events are called when tab+ctrl is clicked to go back

[Airshow]

Napsternapster,

This behaviour may be browser-dependant, so which browser are you testing in?

Airshow

[ankit21]

Napsternapster,

yeah... definetly..it depends on browser...

[Airshow]

Yes ....... so tell me, which one are you using?

Airshow

[napsternapster]

I'm testing this on 4 browers chrome,firefox,IE,and opera and it does the samething.Can anyone tell any event that can I can use except onblur to accomodate an onkepress event because it seems that the onblur event it is going to be invoked everytime it doesn't matter which way you want to leave the textbox onkeypress or by clicking on the form not the input text box.

[Airshow]

Napster^2,

OK, I'll have a play later today and see if I can distinguish between the events.

Airshow

[Airshow]

OK, by having events fire the same handler, you throw away your best (only?) chance of distinguishing reliably between them. Therefore I strongly suggest you have different handlers for the different events (see test code below).

By doing this I had no difficulty correctly detecting onkeypress and onblur (tab and shift-tab).

Opera is the slight problem in that shift (and other modfier keys) fire the onkeypress event. FF is also more prone than IE to firing onkeypress with non-alphanumerics. For that reason you will see in my test code below two lines of "badKeys" rejection in the onkeyPress handler. My badKeys may not be comprehensive; it's just a list of the keycodes I discovered in 20 minutes of play, which display differences in IE6|FF|Opera. Hence it is an attempt to make all browsers behave the same. If you wish to allow only alphas or alphanumerics, then you could replace my "badKeys" with a "goodKeys" list and reverse the logic.

Here's the test code:

onload = function(){
	for (var i=1; i<=2; i++){
		document.getElementById('fld_'+i).onblur = function(e){
			e = e || event;
			var target = e.target || e.srcElement;
			var targetID = target.getAttribute('id')
			document.getElementById('msg').innerHTML = targetID + ' : onblur';
			return true;
		};
		document.getElementById('fld_'+i).onkeypress = function(e){
			e = e || event;
			var target = e.target || e.srcElement;
			var code = e.which || e.keyCode;
			badKeys = "0,8,16,17,18,27,33,34,35,36,37,38,39,40,45,46,112,113,114,115,116,117,118,119,120,121,122,123";
			if(badKeys.indexOf(code.toString()) !== -1) { return true; }//reject various keys to make IE/FF/Opera behave the same.
			var targetID = target.getAttribute('id');
			document.getElementById('msg').innerHTML = targetID + ' : onkeypress : ' + code;
			return true;
		};
	}
}

<div id="msg">&nbsp;</div>
<input id="fld_1"><br>
<input id="fld_2">

To see the effect of not rejecting "badkeys", comment out the line if(badKeys.indexOf........ .

You will need to test in Chrome, which I don't have on my everyday computer.

Airshow