admin管理员组

文章数量:1516870

I'm building a text input field specialized for entering and editing times. One of the parts of the functionality calls for various ways to focus on the different ponents of the time (hours, minutes, seconds), which I indicate through a text selection. Direct selection is possible with the mouse and this is working great. The other feature is keyboard navigation.

Most of this functionality relies on the fact that I'm able to handle keyPress events, suppress the default behavior and substitute a special action instead.

In Firefox, I have this working nicely. The user may use left/right arrow keys or tab/shift-tab to move between parts of the time (and when they get to the end, the next tab key will leave the field and focus the next element normally).

In Internet Explorer 7 (potentially others?) the arrow keys and tab are not even received by the keypress handler. If arrow keys are pressed, the text selection is lost and the cursor moves by one. The effect of providing multiple fields disappears and it results in the control feeling broken. Tab also seems to skip the handler and just immediately flips to the next focusable element.

Are there any tricks to intercepting these keys?

I'm building a text input field specialized for entering and editing times. One of the parts of the functionality calls for various ways to focus on the different ponents of the time (hours, minutes, seconds), which I indicate through a text selection. Direct selection is possible with the mouse and this is working great. The other feature is keyboard navigation.

Most of this functionality relies on the fact that I'm able to handle keyPress events, suppress the default behavior and substitute a special action instead.

In Firefox, I have this working nicely. The user may use left/right arrow keys or tab/shift-tab to move between parts of the time (and when they get to the end, the next tab key will leave the field and focus the next element normally).

In Internet Explorer 7 (potentially others?) the arrow keys and tab are not even received by the keypress handler. If arrow keys are pressed, the text selection is lost and the cursor moves by one. The effect of providing multiple fields disappears and it results in the control feeling broken. Tab also seems to skip the handler and just immediately flips to the next focusable element.

Are there any tricks to intercepting these keys?

  • javascript
  • internet-explorer
  • dom
  • cross-browser
  • dom-events
Share Improve this question edited Sep 23, 2019 at 20:20 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked Jun 25, 2009 at 13:26 Mark RenoufMark Renouf 31k19 gold badges96 silver badges125 bronze badges 2
  • I should add that I am testing IE7 within VMware hosted on Linux. – Mark Renouf Commented Jun 25, 2009 at 13:28
  • Found this reference too: unixpapa./js/key.html – Mark Renouf Commented Jun 25, 2009 at 19:08
Add a ment  | 

1 Answer 1

Reset to default 8

You need to use onkeydown for non-character keys. onkeypress in IE only handles keys that return a string.

To specifically quote the MSDN documentation:

As of Microsoft Internet Explorer 4.0, the onkeypress event fires and can be canceled for the following keys:

  • Letters: A - Z (uppercase and lowercase)
  • Numerals: 0 - 9
  • Symbols: ! @ # $ % ^ & * ( ) _ - + = < [ ] { } , . / ? \ | ' ` " ~
  • System: ESC, SPACEBAR, ENTER

本文标签：

版权声明：本文标题：javascript - Why are arrow keys, tab, etc not received by input field&#39;s onkeypress handler in some browsers? - Stack Ove 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.betaflare.com/web/1745230253a2648791.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。