Prototype guide to the use of learning manuals event.js

Source: Internet
Author: User
Tags lowercase tagname

Keyboard events include KeyDown, Kepress, and KeyUp three, each tapping of the keyboard (in turn?). ) triggers these three events, where KeyDown and KeyUp are relatively low-level hardware-related events, the popular understanding is that these two events can capture a key on the keyboard, and that KeyPress is a higher-level event relative to the character level, which captures the character you type. You can understand that if you hit the A key, the KeyDown and KeyUp events just know that you hit the a key and it doesn't know if you're hitting a capital a (you're pressing the SHIFT key at the same time) or a lowercase a, it's a "key" unit, and you typed in an uppercase A, It's just as if you knocked down SHIFT and a two keys, but keypress can catch you typing in uppercase a or lowercase a.

Before introducing the event object in prototype, we introduce the incident model in the browser, the events in the browser are mainly HTML events, mouse events and keyboard events, the first two events are better understood, here explains the keyboard event and its difference in IE and Firefox.

Also understand the concept that the keys in the keyboard are divided into characters (printable) keys and function keys (not printable), function keys include backspace, Enter, Escape, the arrow keys, page UP, page down, and F1 through F12, etc.

Here's how to use the keyboard event,

The event object for keyboard events contains a KeyCode attribute, which is the only attribute in IE, when the KeyDown and KeyUp events are, the KeyCode attribute represents the key you specifically pressed (also known as virtual KeyCode), When the KeyPress event is captured, the KeyCode attribute refers to the character you typed (character code)

In Firefox the situation is somewhat different, the event object contains a KeyCode property and a CharCode attribute, KeyDown and KeyUp events, KeyCode is the key you press, CharCode is 0 When the KeyPress event is captured, KeyCode for 0,charcode refers to the character you press

When you catch a KeyPress event, when you press the printable character, keycode for 0,charcode refers to the key value of the character you pressed, and when you press the non printable character, the key value for the pressed key is KeyCode, CharCode is 0

Note: The function key does not trigger the KeyPress event, because the keypress corresponds to the printable character, but there is a point IE and FF in the difference, you press a word keys while pressing the ALT key, in IE does not trigger the KeyPress event, but in FF can trigger, I found that when you press the CTRL key in IE, you press the Q key to trigger the event. or by the browser IE itself caught, for example, you press CTRL_A, select something, you press ctrl_s to save the file, but in the FF is much better, the event is first passed to the Web page, and pass it out again.

In view of the difference between IE and FF, if you are lazy, it is recommended to use only Keydow and KeyUp events, the use of these two events in IE and FF basically no difference, and do not capture the ctrl_a and other browsers defined as shortcut key events

Keyboard Events Event Object There are three other properties Altkey, Ctrlkey, and shiftkey to determine if you pressed a key when you pressed the ALT key, these three properties are simpler to use, three kinds of events can be used, there is no compatibility problem with IE and FF

The event in prototype also has the following properties:

Key_backspace:8,

Key_tab:9,

Key_return:13,

Key_esc:27,

Key_left:37,

Key_up:38,

Key_right:39,

KEY_DOWN:40,

KEY_DELETE:46,

KEY_HOME:36,

Key_end:35,

Key_pageup:33,

Key_pagedown:34,

And the following methods:

Element (Event): Returns the elements that trigger the event

Isleftclick (Event): Determines whether the left button is pressed

Pointerx (Event): The horizontal axis of the mouse when events are triggered, for non-mouse events, there is no such information in FF, but in IE?

Pointery (Event): The ordinate of the mouse position when the event is triggered

Stop (event): Prevent events from propagating up and browser default processing methods

Findelement (event, TagName): Find an element of tagName in all ancestors of the element that triggers the event tagName

Observe (element, name, Observer, Usecapture): Registering event handler functions

Stopobserving (element, name, Observer, Usecapture): Unregister event

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.