HighDots Forums  

Re: event handler in <body> doesn't work

Javascript JavaScript language (comp.lang.javascript)


Discuss Re: event handler in <body> doesn't work in the Javascript forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Chris
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 01:55 PM






On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:
Quote:
On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:



Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used as a
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }



Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR
thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

<body onkeydown="return disableBackspace(event);">

I then changed 'reutrn false' by

if (window.event) {
window.event.returnValue = false; // IE
} else {
e.preventDefault(); // W3C browsers
}

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris

Reply With Quote
  #2  
Old   
Chris
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 02:14 PM






On Nov 2, 7:55*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:
Quote:
On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:



On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used as a
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR

thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

body onkeydown="return disableBackspace(event);"

I then changed 'reutrn false' by

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris
Hello.

Here's my complete listing:

<html>
<head>
<title></title>

<script type="text/javascript">
function disableBackspace(e) {
// IE IE
Firefox
var keycode = (window.event) ? window.event.keyCode :
e.which;

if (keycode == 8) {
alert("Backspace pressed");
if (window.event) {
window.event.returnValue = false; // IE
} else {
e.preventDefault(); // W3C
browsers
}
}
}
</script>
</head>

<body onkeydown="return disableBackspace(event);">
<h2>
Press backspace to see what happens</h2>
</body>
</html>

So, in Firefox the alert is shown but navigation goes back to the
previous page???
No problems in IE

how to solve this?

thx
Chris

Reply With Quote
  #3  
Old   
JR
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 02:50 PM



On Nov 2, 5:14*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:
Quote:
On Nov 2, 7:55*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:



On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used as a
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR

thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

body onkeydown="return disableBackspace(event);"

I then changed 'reutrn false' by

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris

Hello.

Here's my complete listing:

html
head
* * <title></title

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * // * * * * * * * * *IE * * * * * * *IE
Firefox
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * * * * * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press backspace to see what happens</h2
/body
/html

So, in Firefox the alert is shown but navigation goes back to the
previous page???
No problems in IE

how to solve this?

thx
Chris
Oops! e.preventDefault() is okay only for the Scenario 1.

For the Scenario 2, you will you need the 'return false;' line.

Cheers,
JR

Reply With Quote
  #4  
Old   
Chris
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 05:28 PM



On Nov 2, 8:50*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:
Quote:
On Nov 2, 5:14*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:



On Nov 2, 7:55*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used asa
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR

thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

body onkeydown="return disableBackspace(event);"

I then changed 'reutrn false' by

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris

Hello.

Here's my complete listing:

html
head
* * <title></title

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * // * * * * * * * * *IE * * * * * * *IE
Firefox
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * * ** * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press backspace to see what happens</h2
/body
/html

So, in Firefox the alert is shown but navigation goes back to the
previous page???
No problems in IE

how to solve this?

thx
Chris

Oops! e.preventDefault() is okay only for the Scenario 1.

For the Scenario 2, you will you need the 'return false;' line.

Cheers,
JR
hi JR.

No, apparently not. Firefox still navigates backwards

Scenario1:

<html>
<head>
<script type="text/javascript">
function disableBackspace(e) {
var keycode = (window.event) ? window.event.keyCode :
e.which;

if (keycode == 8) {
alert("Backspace pressed");

if (window.event) {
window.event.returnValue = false; // IE
} else {
e.preventDefault(); // W3C
browsers
}
}
}
document.onkeydown = disableBackspace;

</script>
</head>

<body>
<h2>
Press bac kspace to see what happens</h2>
</body>
</html>


Scenario2:

<html>
<head>

<script type="text/javascript">
function disableBackspace(e) {
var keycode = (window.event) ? window.event.keyCode :
e.which;

if (keycode == 8) {
alert("Backspace pressed");
return false;
}
}
</script>
</head>

<body onkeydown="return disableBackspace(event);">
<h2>
Press back space to see what happens</h2>
</body>
</html>

any ideas?

thank you
Chris

Reply With Quote
  #5  
Old   
JR
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 05:59 PM



On Nov 2, 8:28*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:
Quote:
On Nov 2, 8:50*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:



On Nov 2, 5:14*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

On Nov 2, 7:55*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used as a
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR

thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

body onkeydown="return disableBackspace(event);"

I then changed 'reutrn false' by

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris

Hello.

Here's my complete listing:

html
head
* * <title></title

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * // * * * * * * * * *IE * * * * * * *IE
Firefox
* * * * * * var keycode = (window.event) ? window.event..keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * * * * * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press backspace to see what happens</h2
/body
/html

So, in Firefox the alert is shown but navigation goes back to the
previous page???
No problems in IE

how to solve this?

thx
Chris

Oops! e.preventDefault() is okay only for the Scenario 1.

For the Scenario 2, you will you need the 'return false;' line.

Cheers,
JR

hi JR.

No, apparently not. Firefox still navigates backwards

Scenario1:

html
head
* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");

* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * * * * * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * * * document.onkeydown = disableBackspace;

* * </script
/head

body
* * <h2
* * * * Press bac kspace to see what happens</h2
/body
/html

Scenario2:

html
head

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * return false;
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press back space to see what happens</h2
/body
/html

any ideas?

thank you
Chris
Well, it's got to be with the event chosen by you; instead of
'onkeydown' use 'onkeypress'

document.onkeypress = disableBackspace;

Take a look at the event order:
http://www.quirksmode.org/dom/events/keys.html

--
JR

Reply With Quote
  #6  
Old   
JR
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 08:04 PM



On Nov 2, 8:59*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:
Quote:
On Nov 2, 8:28*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:



On Nov 2, 8:50*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

On Nov 2, 5:14*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

On Nov 2, 7:55*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

On Nov 2, 6:08*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

On Nov 2, 2:32*pm, Chris <cmr... (AT) gmail (DOT) com> wrote:

Hi.

I tried to disable the backspace-key using 2 different scenarios.
One works but the other doesn't and I don't understand why the 2nd
scenario doesn't work

Scenario 1 (working scenario)

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // activating the handler here
* * * * *document.onkeydown = DisableBackspace;
* * </script
/head

*<body> * <!-- i don't specify any handler in the body section
/body

Hi Chris,
The 'language' attribute is unnecessary, and a function not used as a
constructor shouldn't begin with a capitalized letter.

script type="text/javascript"
* function disableBackspace(e) {
* * var keynum = (window.event) ? window.event.keyCode : e.which;
* * if (keynum == 8) {
* * * return false;
* * }
* }
* document.onkeydown = disableBackspace;
/script

Also the 'return false;' could be written in another way:

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

Scenario 2

head
* * <script language="javascript" type="text/javascript"
* * * * function DisableBackspace(e) {
* * * * * * * // for complete code, see end of mail
* * * * }
* * * * // NOT activating the handler here
* * * * *// document.onkeydown = DisableBackspace;
* * </script
/head

body onkeydown="DisableBackspace(event);"> * *<!-- Activating here
instead --
/body

but the 2nd scenario doesn't work.
why not?

Because it needs a 'return':

body onkeydown="return disableBackspace(event);"

Cheers,
JR

thank you all for your replies!

I still have a problem though

the following works in IE but not in Firefox

body onkeydown="return disableBackspace(event);"

I then changed 'reutrn false' by

* if (window.event) {
* * window.event.returnValue = false; // IE
* } else {
* * e.preventDefault(); // W3C browsers
* }

but still, Firefox goes back to the previous page!!

any ideas why?
how to solve it?

thx
Chris

Hello.

Here's my complete listing:

html
head
* * <title></title

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * // * * * * * * * * *IE * * * * * * *IE
Firefox
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * ** * * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press backspace to see what happens</h2
/body
/html

So, in Firefox the alert is shown but navigation goes back to the
previous page???
No problems in IE

how to solve this?

thx
Chris

Oops! e.preventDefault() is okay only for the Scenario 1.

For the Scenario 2, you will you need the 'return false;' line.

Cheers,
JR

hi JR.

No, apparently not. Firefox still navigates backwards

Scenario1:

html
head
* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");

* * * * * * * * if (window.event) {
* * * * * * * * * * window.event.returnValue = false; * // IE
* * * * * * * * } else {
* * * * * * * * * * e.preventDefault(); * * ** * * * * // W3C
browsers
* * * * * * * * }
* * * * * * }
* * * * }
* * * * document.onkeydown = disableBackspace;

* * </script
/head

body
* * <h2
* * * * Press bac kspace to see what happens</h2
/body
/html

Scenario2:

html
head

* * <script type="text/javascript"
* * * * function disableBackspace(e) {
* * * * * * var keycode = (window.event) ? window.event.keyCode :
e.which;

* * * * * * if (keycode == 8) {
* * * * * * * * alert("Backspace pressed");
* * * * * * * * return false;
* * * * * * }
* * * * }
* * </script
/head

body onkeydown="return disableBackspace(event);"
* * <h2
* * * * Press back space to see what happens</h2
/body
/html

any ideas?

thank you
Chris

Well, it's got to be with the event chosen by you; instead of
'onkeydown' use 'onkeypress'

* document.onkeypress = disableBackspace;

Take a look at the event order:http://www.quirksmode.org/dom/events/keys.html

--
JR
Hi Chris,
It's really hard to say, but IE 8 (maybe 7 too?) works just fine with
document.onkeydown and event.returnValue = false, whereas FF3 and
others work well with document.onkeypress and e.preventDefault(). So,
I've written code specifically for both cases, which can be put either
in a external .js file or at the bottom of the body tag (just before </
body>):

<script type="text/javascript">
document.onkeydown = function () { // IE
var e = window.event, keynum = e.keyCode;
if (keynum === 8) {
e.returnValue = false;
window.alert("Backspace pressed. keyCode = " +keynum);
}
};

document.onkeypress = function (evt) { // FF3, Safari, etc.
var keynum = evt.which;
if (keynum === 8) {
evt.preventDefault(); // Other W3C compliant browsers
window.alert("Backspace pressed. keyCode = " +keynum);
}
};
</script>

But there's an issue with Opera 10: it executes both onkeydown and
onkeypress, because Opera recognizes the IE's event model. Therefore,
we'd need another approach for Opera, testing for browser, using
conditional comments, I don't know yet. I think that's why almost
everybody uses the old 'return false' as in the Scenario #2, because
it's cross-browser.

Cheers,
JR

Reply With Quote
  #7  
Old   
David Mark
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-02-2009 , 11:45 PM



On Nov 2, 8:04*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

[snip]

Quote:
It's really hard to say, but IE 8 (maybe 7 too?) works just fine with
document.onkeydown and event.returnValue = false, whereas FF3 and
others work well with document.onkeypress and e.preventDefault().
First off, keydown doesn't enter into this. As backspace is a
printable character, keypress is where you would expect to deal with
it. IIRC, this key (8) is an exception in IE (meaning you have to
deal with it in keyup).

Quote:
So,
I've written code specifically for both cases, which can be put either
in a external .js file or at the bottom of the body tag (just before </
body>):

script type="text/javascript"
* document.onkeydown = function () { *// IE
* * var e = window.event, keynum = e.keyCode;
* * if (keynum === 8) {
* * * e.returnValue = false;
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };

* document.onkeypress = *function (evt) { // FF3, Safari, etc.
* * var keynum = evt.which;
* * if (keynum === 8) {
* * * evt.preventDefault(); *// Other W3C compliant browsers
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };
/script
Start again. Use one listener function, attach to keypress and
keyup. First time through you can tell which to ignore. And if you
are going to use DOM0 (e.g. onkeypress), return false to prevent the
default action.

And ultimately, this is a horrible idea (breaking the back key).

Reply With Quote
  #8  
Old   
Chris
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-03-2009 , 06:05 AM



On Nov 3, 5:45*am, David Mark <dmark.cins... (AT) gmail (DOT) com> wrote:
Quote:
On Nov 2, 8:04*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

[snip]

It's really hard to say, but IE 8 (maybe 7 too?) works just fine with
document.onkeydown and event.returnValue = false, whereas FF3 and
others work well with document.onkeypress and e.preventDefault().

First off, keydown doesn't enter into this. *As backspace is a
printable character, keypress is where you would expect to deal with
it. *IIRC, this key (8) is an exception in IE (meaning you have to
deal with it in keyup).



So,
I've written code specifically for both cases, which can be put either
in a external .js file or at the bottom of the body tag (just before </
body>):

script type="text/javascript"
* document.onkeydown = function () { *// IE
* * var e = window.event, keynum = e.keyCode;
* * if (keynum === 8) {
* * * e.returnValue = false;
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };

* document.onkeypress = *function (evt) { // FF3, Safari, etc.
* * var keynum = evt.which;
* * if (keynum === 8) {
* * * evt.preventDefault(); *// Other W3C compliant browsers
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };
/script

Start again. *Use one listener function, attach to keypress and
keyup. *First time through you can tell which to ignore. *And if you
are going to use DOM0 (e.g. onkeypress), return false to prevent the
default action.

And ultimately, this is a horrible idea (breaking the back key).

as suggested, if I process the backspace-key for IE in keydown and for
FF in keypress it works well.

I don't want to break the standard, it's just that i try to understand

thank you all for your help!
Chris

Reply With Quote
  #9  
Old   
JR
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-03-2009 , 06:56 PM



On Nov 3, 2:45*am, David Mark <dmark.cins... (AT) gmail (DOT) com> wrote:
Quote:
On Nov 2, 8:04*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

[snip]

It's really hard to say, but IE 8 (maybe 7 too?) works just fine with
document.onkeydown and event.returnValue = false, whereas FF3 and
others work well with document.onkeypress and e.preventDefault().

First off, keydown doesn't enter into this. *As backspace is a
printable character, keypress is where you would expect to deal with
it. *IIRC, this key (8) is an exception in IE (meaning you have to
deal with it in keyup).



So,
I've written code specifically for both cases, which can be put either
in a external .js file or at the bottom of the body tag (just before </
body>):

script type="text/javascript"
* document.onkeydown = function () { *// IE
* * var e = window.event, keynum = e.keyCode;
* * if (keynum === 8) {
* * * e.returnValue = false;
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };

* document.onkeypress = *function (evt) { // FF3, Safari, etc.
* * var keynum = evt.which;
* * if (keynum === 8) {
* * * evt.preventDefault(); *// Other W3C compliant browsers
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };
/script

Start again. *Use one listener function, attach to keypress and
keyup.
According to the MSDN documentation about 'DHTML Events' (http://
msdn.microsoft.com/en-us/library/ms533051(VS.85).aspx), the
'onkeydown' event is the way to go for IE (as of IE 5), because:

a) As of IE 5,
* 'onkeydown' event can be cancelled for the BACKSPACE key by
specifying event.returnValue = false;
* 'onkeyup' event cannot be cancelled, although it fires for the
BACKSPACE key;

b) As of IE 4,
* 'onkeypress' event fires and can be canceled for the alphanumeric
keyboard keys (Letters: A - Z (uppercase and lowercase); Numerals: 0 -
9;
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~;
and some System keys (ESC, SPACEBAR, ENTER). Notice that BACKSPACE is
not listed.


In addition, I've carried out some tests with the following results:
a) document.onkeyup doesn't work (obstruct 'Backspace key') for IE8,
FF3, Safari 3 and Opera 9.64;
b) document.onkeypress doesn't work for Safari 3 and IE 8, but it
works for FF3 and Opera 9.64;
c) document.onkeydown doesn't work for FF3 and Opera 9.64, but it
works for Safari 3 and IE 8.

So it's possible to solve the problem by referencing the listener
(disableBackspace) in both document.onkeypress (FF3 and Opera 9.64)
and document.onkeydown (okay for Safari 3 and IE 8) as below:

<script type="text/javascript">

function disableBackspace (e) {
var evt = window.event || e,
keynum = evt.keyCode ? evt.keyCode : evt.which;
if (keynum === 8) {
evt.returnValue = false; // IE
evt.preventDefault(); // W3C standards compliant browsers
window.alert("Backspace pressed. keyCode = " +keynum);
}
}

document.onkeydown = disableBackspace;
document.onkeypress = disableBackspace;
</script>


Quote:
First time through you can tell which to ignore. *And if you
are going to use DOM0 (e.g. onkeypress), return false to prevent the
default action.
Yep! 'return false' seems to be the cross-browser solution, but it
requires the (Jurassic)
<body onkeydown="return disableBackspace(event);">

Quote:
And ultimately, this is a horrible idea (breaking the back key).
I totally agree with you!

Cheers,
JR

Reply With Quote
  #10  
Old   
David Mark
 
Posts: n/a

Default Re: event handler in <body> doesn't work - 11-03-2009 , 09:45 PM



On Nov 3, 6:56*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:
Quote:
On Nov 3, 2:45*am, David Mark <dmark.cins... (AT) gmail (DOT) com> wrote:



On Nov 2, 8:04*pm, JR <groups_j... (AT) yahoo (DOT) com.br> wrote:

[snip]

It's really hard to say, but IE 8 (maybe 7 too?) works just fine with
document.onkeydown and event.returnValue = false, whereas FF3 and
others work well with document.onkeypress and e.preventDefault().

First off, keydown doesn't enter into this. *As backspace is a
printable character, keypress is where you would expect to deal with
it. *IIRC, this key (8) is an exception in IE (meaning you have to
deal with it in keyup).

So,
I've written code specifically for both cases, which can be put either
in a external .js file or at the bottom of the body tag (just before </
body>):

script type="text/javascript"
* document.onkeydown = function () { *// IE
* * var e = window.event, keynum = e.keyCode;
* * if (keynum === 8) {
* * * e.returnValue = false;
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };

* document.onkeypress = *function (evt) { // FF3, Safari, etc.
* * var keynum = evt.which;
* * if (keynum === 8) {
* * * evt.preventDefault(); *// Other W3C compliant browsers
* * * window.alert("Backspace pressed. keyCode = " +keynum);
* * }
* };
/script

Start again. *Use one listener function, attach to keypress and
keyup.

According to the MSDN documentation about 'DHTML Events' (http://
msdn.microsoft.com/en-us/library/ms533051(VS.85).aspx), the
'onkeydown' event is the way to go for IE (as of IE 5), because:

a) As of IE 5,
* 'onkeydown' event can be cancelled for the BACKSPACE key by
specifying event.returnValue = false;
* 'onkeyup' event cannot be cancelled, although it fires for the
BACKSPACE key;
Isn't that something. Makes you wonder what MS has against the BS
key. Maybe they are trying to make it hard to break.

Quote:
b) As of IE 4,
* 'onkeypress' event fires and can be canceled for the alphanumeric
keyboard keys (Letters: A - Z (uppercase and lowercase); Numerals: 0 -
9;
Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~;
and some System keys (ESC, SPACEBAR, ENTER). Notice that BACKSPACE is
not listed.
Well, that likely means that IE4 is the same story. FWIW, that's good
news.

Quote:
In addition, I've carried out some tests with the following results:
a) document.onkeyup doesn't work (obstruct 'Backspace key') for IE8,
No change there.

Quote:
FF3, Safari 3 and Opera 9.64;
b) document.onkeypress doesn't work for Safari 3 and IE 8, but it
works for FF3 and Opera 9.64;
We know about IE. Additionally Safari 3 won't let you cancel
onkeypress with document and DOM0.

Quote:
c) document.onkeydown doesn't work for FF3 and Opera 9.64, but it
works for Safari 3 and IE 8.
Again, we know about IE. What do you mean onkeydown "doesn't work"
for FF3?

Regardless, the keydown event is not normally used for this. Granted,
the original request doesn't require any action except to cancel the
default action, so that is a bit of a moot point.

Quote:
So it's possible to solve the problem by referencing the listener
(disableBackspace) in both document.onkeypress (FF3 and Opera 9.64)
and document.onkeydown (okay for Safari 3 and IE 8) as below:

[snip]

Or something like this:-

var bsKeyEventType;
var myBSCallback = function() {
//console.log('Event type: ' + bsKeyEventType);
};

document.onkeydown = document.onkeypress = document.onkeyup = function
(evt) {
evt = evt || window.event;
var key = evt.which || evt.keyCode;

if (key == 8) {
switch (evt.type) {
case 'keydown':
if (!bsKeyEventType) {
bsKeyEventType = 'keydown';
document.onkeypress = null;
}
break;
case 'keypress':
if (!bsKeyEventType) {
bsKeyEventType = 'keypress';
document.onkeydown = null;
document.onkeyup = null;
}
myBSCallback();
break;
case 'keyup':
if (!bsKeyEventType) {
bsKeyEventType = 'keyup';
document.onkeydown = null;
document.onkeypress = null;
}
myBSCallback();
}
return false;
}
};

Quote:
Yep! 'return false' seems to be the cross-browser solution, but it requires the (Jurassic) <body onkeydown="return disableBackspace(event);"
No it doesn't.

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.