Detecting a backspace in a textbox...
I was wondering if there is any way to detect if a user presses the backspace key from within a textbox:
<input type="text" ... onkeypress="alert('You pushed a key!');">
As of now, I haven't seen any way of doing this. It doesn't fire if i press backspace, it only fires for other keys.
For some reason, the onkeydown and onkeyup event handlers don't fire at all. What's wrong there?
But the bigger question is the backspace keypress detection. Any help would be appreciated.
<input type="text" ... onkeypress="alert('You pushed a key!');">
As of now, I haven't seen any way of doing this. It doesn't fire if i press backspace, it only fires for other keys.
For some reason, the onkeydown and onkeyup event handlers don't fire at all. What's wrong there?
But the bigger question is the backspace keypress detection. Any help would be appreciated.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
mirthless,
if you can't get the onkeydown and onkeyup event handlers to fire at all you probably have some error on your page,
could you post the code you are using ?
SnowFlake
if you can't get the onkeydown and onkeyup event handlers to fire at all you probably have some error on your page,
could you post the code you are using ?
SnowFlake
ASKER
So let me see, something like:
...
<script>
function myFunc() {
if (window.event)
key = window.event.keyCode;
else
key = e.which;
if(key==10)
alert("You pressed backspace!");
}
</script>
...
...
<form>
<input type="text" onkeypress="myFunc();">
</form>
...
...
<script>
function myFunc() {
if (window.event)
key = window.event.keyCode;
else
key = e.which;
if(key==10)
alert("You pressed backspace!");
}
</script>
...
...
<form>
<input type="text" onkeypress="myFunc();">
</form>
...
ASKER
Sure thing, SnowFlake, very crude test code, I'm just experimenting:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<form name="f1">
<input type="textbox" name="t1" onkeydown="document.f1.t2.
<input type="textbox" name="t2" value="0">
</form>
</body>
</html>
That's how it stands now. The events in t1 never fire, no matter what keys I press
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<form name="f1">
<input type="textbox" name="t1" onkeydown="document.f1.t2.
<input type="textbox" name="t2" value="0">
</form>
</body>
</html>
That's how it stands now. The events in t1 never fire, no matter what keys I press
ASKER
Wow, simply making a function wrapper to make the alert rather than directly alerting from within onkeypress="..." makes a huge difference. Btw, for me backspace is 8, I had to actually alert it to figure it out.
However when I try to do the same with onkeydown/up, I still have no fire. Here's what I have now (again, it works perfectly with onkeypress, now I want it to work from onkeydown/up):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function myFunc() {
var key;
if (window.event)
key = window.event.keyCode;
else
key = e.which;
if (key == 8)
document.f1.t2.value="1";
}
//-->
</script>
</head>
<body>
<form name="f1">
<input type="textbox" name="t1" onkeydown="myFunc();" onkeyup="document.f1.t2.va
<input type="textbox" name="t2" value="0">
</form>
</body>
</html>
However when I try to do the same with onkeydown/up, I still have no fire. Here's what I have now (again, it works perfectly with onkeypress, now I want it to work from onkeydown/up):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function myFunc() {
var key;
if (window.event)
key = window.event.keyCode;
else
key = e.which;
if (key == 8)
document.f1.t2.value="1";
}
//-->
</script>
</head>
<body>
<form name="f1">
<input type="textbox" name="t1" onkeydown="myFunc();" onkeyup="document.f1.t2.va
<input type="textbox" name="t2" value="0">
</form>
</body>
</html>
ASKER
Wait a second, everything seems to be working now... Apparently the program I use to test the page is not fully functional. As soon as I saved the .htm file to disk and tested it with the full IE browser, everything worked fine, even the snippet I initially submitted. I guess this is the last time I'm going to trust the editor with event testing. Sorry, my fault for not considering the program, but I'll give timker a few points for the code snippet.
well,
to me both events seem to be working
try anc change
onkeyup="document.f1.t2.va
to
onkeyup="document.f1.t2.va
and
if (key == 8)
document.f1.t2.value="1";
to
if (key == 8)
document.f1.t2.value=+"1";
This way one event will not hide the other.
SnowFlake
to me both events seem to be working
try anc change
onkeyup="document.f1.t2.va
to
onkeyup="document.f1.t2.va
and
if (key == 8)
document.f1.t2.value="1";
to
if (key == 8)
document.f1.t2.value=+"1";
This way one event will not hide the other.
SnowFlake
if(key==10)
{
...
}