Read jquery's 9th (wrap the event object)

Due to the differences in original event objects in various browsers, most JS libraries/frameworks fix and package native event objects more or less.

For example, use cancelBubble to stop event bubbling IE, and use stopPropagation in standard browsers.

Get the event source object, IE uses srcElement, and standard browser uses target.

JQuery uses the jQuery. Event class and jQuery. event. fix Method to fix and encapsulate native Event objects.

View sourceprint? 01 jQuery. Event = function (src ){

02 // Allow instantiation without the new keyword

03 if (! This. preventDefault ){

04 return new jQuery. Event (src );

05}

06

07 // Event object

08 if (src & src. type ){

09 this. originalEvent = src;

10 this. type = src. type;

11

12 // Events bubbling up the document may have been marked as prevented

13 // by a handler lower down the tree; reflect the correct value.

14 this. isdefapreprevented = (src. defaultPrevented | src. returnValue = false |

15 src. getPreventDefault & src. getPreventDefault ())? ReturnTrue: returnFalse;

16

17 // Event type

18} else {

19 this. type = src;

20}

21

22 // timeStamp is buggy for some events on Firefox (#3843)

23 // So we wont rely on the native value

24 this. timeStamp = jQuery. now ();

25

26 // Mark it as fixed

27 this [jQuery. expando] = true;

28 };

29

30 function returnFalse (){

31 return false;

32}

33 function returnTrue (){

34 return true;

35}

36

37 // jQuery. Event is based on DOM3 Events as specified by the ECMAScript Language Binding

38 // html "> http://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html

39 jQuery. Event. prototype = {

40 preventDefault: function (){

41 this. isdefapreprevented = returnTrue;

42

43 var e = this. originalEvent;

44 if (! E ){

45 return;

46}

47

48 // if preventDefault exists run it on the original event

49 if (e. preventDefault ){

50 e. preventDefault ();

51

52 // otherwise set the returnValue property of the original event to false (IE)

53} else {

54 e. returnValue = false;

55}

56 },

57 stopPropagation: function (){

58 this. isPropagationStopped = returnTrue;

59

60 var e = this. originalEvent;

61 if (! E ){

62 return;

63}

64 // if stopPropagation exists run it on the original event

65 if (e. stopPropagation ){

66 e. stopPropagation ();

67}

68 // otherwise set the cancelBubble property of the original event to true (IE)

69 e. cancelBubble = true;

70 },

71 stopImmediatePropagation: function (){

72 this. isImmediatePropagationStopped = returnTrue;

73 this. stopPropagation ();

74 },

75 isdefapreprevented: returnFalse,

76 isPropagationStopped: returnFalse,

77 isImmediatePropagationStopped: returnFalse

78 };

 

The jQuery. Event class mainly performs the following work:

1. extended the originalEvent attribute, which saves native event objects.
2. Fixed the timeStamp. This attribute is not supported by IE6/7/8, and the returned values in other supported browsers are also different.
3. Prevent DOM elements from using preventDefault by default.
4. stopPropagation is used to stop event bubbling.
5. Several Methods for implementing or expanding the DOM3 event: stopImmediatePropagation, isDefaultPrevented, isPropagationStopped, isImmediatePropagationStopped

In addition, the jQuery. Event write class method is also unique. It uses hidden new to create objects.

 

The jQuery. event. fix method is as follows:

View sourceprint? 01 fix: function (event ){

02 if (event [jQuery. expando]) {

03 return event;

04}

05

06 // store a copy of the original event object

07 // and "clone" to set read-only properties

08 var originalEvent = event;

09 event = jQuery. Event (originalEvent );

10

11 for (var I = this. props. length, prop; I ;){

12 prop = this. props [-- I];

13 event [prop] = originalEvent [prop];

14}

15

16 // Fix target property, if necessary

17 if (! Event.tar get ){

18 & n