The difference between window.event and in IE and FF

Source: Internet
Author: User

The difference between window.event and in IE and FF

The event object is valid only if it occurs.

Some properties of an event are only meaningful for a particular event. For example, the Fromelement and Toelement properties only make sense for Onmouseo tutorials ver and onmouseout events.

Example

The following example checks to see if the mouse clicks on the link and cancels the link jump if the SHIFT key is pressed.

<script language= "JScript" >
function Cancellink () {
if (Window.event.srcelement.tagname = "a" && Window.event.shiftkey)
Window.event.returnvalue = false;
}
</script>
<body onclick= "Cancellink ()" >

Window.event
ie: there are window.event objects
FF: no Window.event object. You can pass an event object to a parameter of a function. such as Onmousemove=domousemove (event)
Mouse Current coordinates
Ie:event.x and Event.y.
Ff:event.pagex and Event.pagey.
General: Both have Event.clientx and Event.clienty attributes.

The current coordinates of the mouse (plus the distance the scroll bar rolls over)
Ie:event.offsetx and Event.offsety.
Ff:event.layerx and Event.layery.
Coordinates of the x and Y of the label: Style.posleft and Style.postop
ie: there is.
FF: No.
General: Object.offsetleft and Object.offsettop.

Height and width of the form
Ie:document.body.offsetwidth and Document.body.offsetheight. Note: The page must have a body tag at this point.
Ff:window.innerwidth and Window.innerhegiht, as well as Document.documentelement.clientwidth and document.documentelement.clientheight.
General: Document.body.clientwidth and Document.body.clientheight.

Adding events
Ie:element.attachevent ("onclick", func);
Ff:element.addeventlistener ("Click", Func, True).
General: Element.onclick=func. Although you can use the OnClick event, the effect of the onclick and the above two methods is not the same, onclick only executes a process, and attachevent and AddEventListener execute a list of processes, that is, multiple processes. For example: Element.attachevent ("onclick", func1), Element.attachevent ("onclick", Func2) so func1 and Func2 will be executed.

Custom Properties for labels
IE: if a property value is defined for the label DIV1, the value can be obtained Div1.value and div1["value".
FF: cannot be taken with Div1.value and div1["value".
General: Div1.getattribute ("value").

Parent node, child node, and delete node
Ie:parentelement, Parement.children,element.romovenode (true).
Ff:parentnode, Parentnode.childnodes,node.parentnode.removechild (node).


Type: The types of events, such as Click in Onlick;
Srcelement/target: The event source, is the element that occurs;
Button: the mouse button declared to be pressed, Integer, 1 for the left, 2 for the right, 4 for the key, if you press more than one key, the wine added to these values, so 3 on behalf of the left and right keys pressed at the same time; (Firefox 0 for the left, 1 for the middle key, 2 for the right-hand button)
Clientx/clienty: The position of the mouse relative to the upper-left corner of the viewable document area of the browser window when the event occurs (in the DOM standard, neither of these property values considers the document's scrolling, that is, wherever the document scrolls, whenever the event occurs in the upper-left corner of the window, Clientx and Clienty are 0, so in IE, to get the coordinates of the event to occur relative to the beginning of the document, add Document.body.scrollleft and Document.body.scrolltop)
Offsetx,offsety/layerx,layery: When the event occurs, the mouse is relative to the position of the upper-left corner of the source element;
X,y/pagex,pagey: Retrieves an integer relative to the parent element's mouse horizontal coordinate;
Altkey,ctrlkey,shiftkey, etc.: Returns a Boolean value;
KeyCode: Returns the code of the key at the time of KeyDown where KeyUp event occurred, and the Unicode character of the KeyPress event; (Firefox2 is not supported Event.keycode and can be replaced by Event.which)
Fromelement,toelement: The former refers to the MouseOver event in the mouse moved the document element, which refers to the Mouseout event in the mouse moved to the document elements;
Cancelbubble: A Boolean property that, when set to true, further bubbles the stop event to an containment-level element; (e.cancelbubble = true; equivalent to e.stoppropagation ();)
ReturnValue: A Boolean property that, when set to False, organizes the browser to perform the default event action; (E.returnvalue = false; equivalent to E.preventdefault ();)
Attachevent (), DetachEvent ()/addeventlistener (), RemoveEventListener: A method for registering multiple event-handling functions for the development of DOM object event types, which have two parameters, the first is the event type, The second one is the event handler function. At the time the Attachevent () event executes, the This keyword points to the Window object, not to the element in which the event occurred;
Screenx, Screeny: The position of the mouse pointer relative to the upper-left corner of the display, if you want to open a new window, these two properties are important;
Some notes:

An event represents the state of an incident, such as the element that triggers the events object, the position and state of the mouse, the key pressed, and so on;
The event object is valid only if it occurs.
Firefox in the event and IE in the different, ie in the global variable, ready to use, Firefox in the parameters to boot to use, is the run-time temporary variables.
In the Ie/opera is window.event, in Firefox is event, and the object of the event, in IE is window.event.srcelement, in Firefox is Event.target,opera both are available.
The following two sentences have the same effect
var evt = (evt)? EVT: ((window.event)? window.event:null);
var evt = evt | | window.event; Firefox under window.event is null, ie the event is null
Bubbles of events in IE
In IE, events can bubble up to the top of the containment layer a little bit, that is to say, the event handlers defined by the underlying DOM nodes, to the upper nodes if there is an event handler for the same event type as the lower level, then the top-level event handler is executed. For example, a div tag contains a, and if both tags have a handler for the OnClick event, the execution is done by first executing the OnClick event handler for label A, and then executing the DIV's event handler function. If you do not want to execute the OnClick event handler for the Upper Div after the event handler function is finished, set the cancelbubble to True

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.