Js event handler cross-browser solution, js Solution
The examples in this article share the cross-browser solution of js Event Handlers for your reference. The specific content is as follows:
<! DOCTYPE html>
We will share with you the Javascript native event processing cross-browser code:
// Cross-browser event processor addition method var EventUtil = {addHandler: function (elem, type, handler) {if (elem. addEventListener) {elem. addEventListener (type, handler, false);} else if (elem. attachEvent) {elem. attachEvent ("on" + type, handler); // when you add multiple handler of the same type, the rule in IE mode is the first trigger last added} else {if (typeof elem ["on" + type] = 'function ') {var oldHandler = elem ["on" + type]; elem ["on" + type] = function () {oldHandler (); handler ();} Else {elem ["on" + type] = handler; // multiple event processors can be added. }}, getEvent: function (event) {return event? Event: window. event;}, getTarget: function (event) {return event.tar get | event. srcElement;}, preventDefault: function (event) {if (event. preventDefault) {event. preventDefault ();} else {event. returnValue = false ;}}, removeHandler: function (elem, type, handler) {if (elem. removeEventListener) {elem. removeEventListener (type, handler, false);} else if (elem. detachEvent) {elem. detachEvent ("on" + type, handler);} else {elem ["on" + type] = null; // the removal of a single event processor is not supported. Only all event processors can be removed }}, stopPropagation: function (event) {if (event. stopPropagation) {event. stopPropagation ();} else {event. cancelBubble = true ;}}, getRelatedTarget: function (event) {if (event. relatedTarget) {return event. relatedTarget;} else if (event. toElement & event. type = "mouseout") {return event. toElement;} else if (event. fromElement & event. type = "mouseover") {return event. fromElement;} else {return null ;},/* the left and middle buttons of IE8 are both 0; FF cannot recognize the middle keys; Chrome is normal */getButton: function (event) {// return 0, 1, 2-left, center, right if (document. implementation. hasFeature ("MouseEvents", "2.0") {return event. button;} else {switch (event. button) {case 0: case 1: case 3: case 5: case 7: return 0; break; case 2: case 6: return 2; break; case 4: return 1; break; default: break ;}},/* can only detect keypress events. the return value is equal to the character encoding to be displayed * // * IE and Chrome are triggered only by the character key that can be displayed, other FF keys can also be triggered. The returned value is 0 */getCharCode: function (event) {if (typeof event. charCode = "number") {return event. charCode;} else {return event. keyCode ;}}};
The above is all the content in this article, hoping to help you solve js event handler cross-browser.
Articles you may be interested in:
- Required to compile cross-browser javascript code [compatible javascript multi-browser writing]
- Notes for developing cross-browser javascript
- Common cross-browser operations of javascript Range objects
- Cross-browser support for modification and synchronization of js listening form values
- Javascript cross-browser Development Experience Summary (5) js events
- Create a cross-browser event processing mechanism using javascript [produced by Blue-Dream]
- JavaScript code used to determine whether the window is minimized (cross-browser)
- Cross-browser common and reusable tab switch js Code
- Copy data to the Clipboard using JavaScript in Firefox (Copy to Clipboard cross-browser Edition)
- Summary on cross-browser compatibility between css and javascript