By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,262 Members | 1,128 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,262 IT Pros & Developers. It's quick & easy.

Even canceling in Firefox

P: n/a
Hi!

I want to cancel up and down arrows in list (select) element.
Here is the code:

<script>

function Arrows (event)
{
code = event.keyCode;
if (code == 38)
alert('Up');

if (code == 40)
alert('Down');
if (event.stopPropagation)
event.stopPropagation();
else
event.cancelBubble = true;

if (event.preventDefault)
event.preventDefault();
else
event.returnValue = false;
return false;
};
</script>

<form id="theform">
<select id="answ" name="answ" style="width:300px"
multiple size="5" onkeydown="return Arrows(event);">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="4">four</option>
<option value="5">five</option>
</select>
</form>
It works in IE but doesn't in Firefox. Any ideas how to fix it?

Marcin
--
Marcin Nowak
www.wyprawa.net .ch.o_mi.k_@.c.ho_m.ik.n_et_
Ochrona adresu: usun kropki z wyjatkiem ostatniej, podkreslenia
oprˇcz pierwszego. Address protection: remove dots except for
the last one, underscores excluding the first one.
Feb 20 '06 #1
Share this Question
Share on Google+
8 Replies


P: n/a
VK

Marcin Nowak wrote:
<select id="answ" name="answ" style="width:300px"
multiple size="5" onkeydown="return Arrows(event);">


SELECT supports by specs onfocus, onchange, onblur. Whatever and
*however* it supports atop of it is up to the fantasy of a particular
browser producer.

In your case I would make a CSS widget instead.

Also you may to repopulate the list based on the selected items.
Infortunately the most evident way by setting disabled true/false for
option or optgroup doesn't work in IE (despite documented).

Feb 20 '06 #2

P: n/a
VK wrote:
Marcin Nowak wrote:
<select id="answ" name="answ" style="width:300px"
multiple size="5" onkeydown="return Arrows(event);">
SELECT supports by specs onfocus, onchange, onblur.


That is not quite correct. It supports more event handler attributes than
those:

,-[from HTML 4.01 Strict; compacted whitespace]
|
| <!ELEMENT SELECT - - (OPTGROUP|OPTION)+ -- option selector -->
| <!ATTLIST SELECT
| %attrs; -- %coreattrs, %i18n, %events --
^^^^^^^ ^^^^^^^
| name CDATA #IMPLIED -- field name --
| size NUMBER #IMPLIED -- rows visible --
| multiple (multiple) #IMPLIED -- default is single selection --
| disabled (disabled) #IMPLIED -- unavailable in this context --
| tabindex NUMBER #IMPLIED -- position in tabbing order --
| onfocus %Script; #IMPLIED -- the element got the focus --
| onblur %Script; #IMPLIED -- the element lost the focus --
| onchange %Script; #IMPLIED -- the element value was changed --
| >
| [...]
| <!ENTITY % attrs "%coreattrs; %i18n; %events;">
| [...]
| <!ENTITY % events
| "onclick %Script; #IMPLIED -- a pointer button was clicked --
| ondblclick %Script; #IMPLIED -- a pointer button was double clicked --
| onmousedown %Script; #IMPLIED -- a pointer button was pressed down --
| onmouseup %Script; #IMPLIED -- a pointer button was released --
| onmouseover %Script; #IMPLIED -- a pointer was moved onto --
| onmousemove %Script; #IMPLIED -- a pointer was moved within --
| onmouseout %Script; #IMPLIED -- a pointer was moved away --
| onkeypress %Script; #IMPLIED -- a key was pressed and released --
| onkeydown %Script; #IMPLIED -- a key was pressed down --
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
| onkeyup %Script; #IMPLIED -- a key was released --"
| >
Whatever and *however* it supports atop of it is up to the fantasy of
a particular browser producer.
True, if you read that statement in context. False otherwise.
In your case I would make a CSS widget instead.


Whereas the reason that it does not work in Firefox has nothing to do with
the markup at all (although it is not Valid). Firefox does support the
specified `onkeydown' event handler attribute for `select' elements used
here.
PointedEars
Feb 20 '06 #3

P: n/a
Marcin Nowak wrote:
I want to cancel up and down arrows in list (select) element.
Here is the code:
[...]
It works in IE but doesn't in Firefox.
"Does not work" is a useless error description. [psf 4.11]

<URL:http://jibbering.com/faq/#FAQ4_43>
Any ideas how to fix it?


I do question your crippling keyboard navigation, and the code is not
Valid markup[1] (however, the `select' element does have an `onkeydown'
attribute, ignore VK).

It works though, i.e. the alert box displays the proper value ("Up"/"Down")
and the selection does not change, for me unchanged (included in an
otherwise Valid HTML 4.01 document) in

Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.1) Gecko/20060209
Debian/1.5.dfsg+1.5.0.1-2 Firefox/1.5.0.1.

The only thing I get is

| Warning: assignment to undeclared variable code
| Source file: http://localhost/scripts/test/dom/ev...lect-onkeydown
| Line: 13
| code = event.keyCode;
| -------^

(You should use the `var' keyword to declare this a local variable.)

So the error must be elsewhere.
PointedEars
___________
[1] <URL:http://validator.w3.org/>
Feb 20 '06 #4

P: n/a


Marcin Nowak wrote:

function Arrows (event)
{
code = event.keyCode;
if (code == 38)
alert('Up');

if (code == 40)
alert('Down');
if (event.stopPropagation)
event.stopPropagation();
else
event.cancelBubble = true;

if (event.preventDefault)
event.preventDefault(); <select id="answ" name="answ" style="width:300px"
multiple size="5" onkeydown="return Arrows(event);">


Cross browser key event cancelling is difficult, if you are trying that
with Firefox 1.0.x then trying onkeydown does help, Firefox 1.0.x can
only cancel keys onkeypress.

--

Martin Honnen
http://JavaScript.FAQTs.com/
Feb 20 '06 #5

P: n/a
Martin Honnen wrote:
Cross browser key event cancelling is difficult, if you are trying that
with Firefox 1.0.x then trying onkeydown does help, Firefox 1.0.x can
only cancel keys onkeypress.


Huh? :)

Did you mean "... with Firefox 1.5.0.x ..., Firefox 1.0.x can only ..."?
PointedEars
Feb 20 '06 #6

P: n/a


Thomas 'PointedEars' Lahn wrote:
Martin Honnen wrote:

Cross browser key event cancelling is difficult, if you are trying that
with Firefox 1.0.x then trying onkeydown does help, Firefox 1.0.x can
only cancel keys onkeypress.


Huh? :)


Sorry, a 'not' got lost, it should have been
"if you are trying that with Firefox 1.0.x then trying onkeydown does
not help, Firefox 1.0.x can only cancel keys onkeypress."
--

Martin Honnen
http://JavaScript.FAQTs.com/
Feb 20 '06 #7

P: n/a
Thomas 'PointedEars' Lahn napisał(a):
Marcin Nowak wrote:
I want to cancel up and down arrows in list (select) element.
Here is the code:
[...]
It works in IE but doesn't in Firefox.


"Does not work" is a useless error description. [psf 4.11]


Event is not canceled - that is what doesn't work.
Focus is in input element, I press down arrow. My function
changes focus to 'option' element (first line of 'option' is
selected) and tries to cancel event. After function ends, the
down arrow keeps working - this event changes selection to the
second line of 'option' element.

Marcin
--
Marcin Nowak
www.wyprawa.net .ch.o_mi.k_@.c.ho_m.ik.n_et_
Ochrona adresu: usun kropki z wyjatkiem ostatniej, podkreslenia
opr├│cz pierwszego. Address protection: remove dots except for
the last one, underscores excluding the first one.
Feb 20 '06 #8

P: n/a
Marcin Nowak wrote:
Thomas 'PointedEars' Lahn napisał(a):
Marcin Nowak wrote:
I want to cancel up and down arrows in list (select) element.
Here is the code:
[...]
It works in IE but doesn't in Firefox.


"Does not work" is a useless error description. [psf 4.11]


Event is not canceled - that is what doesn't work.
Focus is in input element, I press down arrow. My function
changes focus to 'option' element (first line of 'option' is
selected) and tries to cancel event. After function ends, the
down arrow keeps working - this event changes selection to the
second line of 'option' element.


Well, as Martin's posting indicates, either you are using Firefox <= 1.0.x
(or probably any Mozilla/5.0 with rv < 1.7 for that matter[1]), or your
Firefox 1.5.0.x is buggy and this should be reported on Bugzilla (if
someone did not do that before). Because it does work in my Firefox
1.5.0.1/Linux (even though it is not Valid), as I wrote already.
PointedEars
___________
[1] tested working with
Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.7.12) Gecko/20060205
Debian/1.7.12-1.1
Feb 20 '06 #9

This discussion thread is closed

Replies have been disabled for this discussion.