[Jquery event object event] | jqeury bind binding event and unbind deletion binding event, jqueryjqeury

Source: Internet
Author: User

[Jquery event object event] | jqeury bind binding event and unbind deletion binding event, jqueryjqeury


<1>

Jqeury event object: The jqeury event object is passed in through the first parameter in the function () method. There is no limit on the name when receiving the event. We can set it as needed, but most of the time we set it to e or event. So we can write function (e) in this way. The e object is automatically passed to this function by the browser, and then this function is received.

<Html> 


Jquery event object event

Jqeury event object: The jqeury event object is passed in through the first parameter in the function () method. There is no limit on the name when receiving the event. We can set it as needed, but most of the time we set it to e or event. So we can write function (e) in this way. The e object is automatically passed to this function by the browser, and then this function is received.

<!DOCTYPE html>
<Script type = "text/javascript"> // jqeury event object: The jqeury event object is passed through the first parameter in the function () method, there is no limit on the name of the recipient. We can set it as needed, but most of the time we set it to e or event. So we can write function (e) in this way. The e object is automatically passed to this function by the browser, and then this function is received. $ ("# "). Click (function (e) {alert (e. type); // obtain the event type of the click event. click alert(e.tar get) // obtain the DOM element of the binding event: [object HTMLDivElement] We can see that there is a DivElement behind HTML. This shows that this DOM element is a div element alert (e. timeStamp); // obtain the timeStamp triggered by the event}) about extra data $ ("# B "). click (123, function (e) {// The first parameter is an additional data, which can be a value, String, object, or array. This extra data can be a variable or can be directly written. For example, here we set the extra data to a value of 123 alert (e. data); // print out the additional data when the event is called: 123}) $ ("# c "). click ("China", function (e) {// additional data can be a string alert (e. data); // print out: China}) $ ("# d "). click ({user: 'zhang san', age: 25}, function (e) {// additional data can be an object alert (e. data); // print out: [object Object] alert (e. data. user); // print out: Michael Jacob alert (e. data. age); // print out: 25}) $ ("# e "). click ([1, 2, 3, "a", "B", "c"], function (e) {// additional data can be an array alert (E. data); // print 1, 2, 3, a, B, c alert (e. data [1]); // print out: 2 alert (e. data [3]); // print out: a}) var aa = "abc"; $ ("# f "). click (aa, function (e) {// additional data can be a variable alert (e. data); // print out: abc}) // obtain the returned value of the previous same event for result $ ("# g "). click (function (e) {return "" ;}); $ ("# g "). click (function (e) {alert (e. result); // The returned value of the previous same event (click Event) is the United States, so the output is: United States}) // For pageX/pageY $ (window ). click (function (e) {// pageX: Obtain the horizontal sit relative to the page Origin Mark // screenX: Obtain the horizontal coordinate of the display screen position // clientX: Obtain the horizontal coordinate alert (e. pageX + "-" + e. screenX + "-" + e. clientX); // by printing these three horizontal coordinates, we know that their values are the same. }) $ (Window ). click (function (e) {// pageY: Obtain the vertical coordinates relative to the page origin (if my display resolution is 1920*1080, if I can drag the scroll bar, pageY value may be far greater than 1080) // screenY: gets the vertical coordinates of the display screen position (if my display resolution is 1920*1080, then screenY can get the maximum value of 1080, even if you drag the scroll bar down, the maximum value of the scroll bar is only 1080.) // clientY: obtain the vertical coordinates relative to the page view (if my display resolution is 1920*1080 then clientY can get the maximum value is 1080-(the browser header height) alert (e. pageY + "-" + e. screenY + "-" + e. clientY); // print the three vertical coordinates to know that they are different}) // which obtains the right-click (, 3) on the left of the mouse ), or get the keyboard button $ (window ). click (function (e) {alert (e. which); // when I press the left button to print out: 1 when I press the pulley to print out: 2 when I press the right button to print out: 3}) $ (window ). mousedown (function (e) {alert (e. which); // when I press the left button to print out: 1 when I press the pulley to print out: 2 when I press the right button to print out: 3 }) // keyup is used to obtain the keyboard key $ (window ). keyup (function (e) {alert (e. which); // when I press the key on the keyboard, the corresponding key and keyboard code will be displayed (the keyboard code is a number)}) $ (window ). click (function (e) {alert (e. altKey) // obtain whether or not the alt key is pressed at the same time; when I only click it, it is printed: false; when I press and hold alt, it is printed at the same time: true}) // This window can be replaced with the elements you need, such as $ ("input "). click (function (e) {alert (e. altKey)}) $ (window ). click (function (e) {alert (e. ctrlKey) // obtain whether or not to click and press the ctrl key at the same time. When I click only, false is printed; when I press ctrl, print it at the same time: true}) $ (window ). click (function (e) {alert (e. shiftKey) // get whether to click and press the shift key at the same time; when I click only, print: false; when I hold down shift, print out when I click: true}) </script>


We will use images to explain the coordinates. See. Note: pageX pageY is the most commonly used

Alert (e. pageX + "-" + e. screenX + "-" + e. clientX); // by printing these three horizontal coordinates, we know that their values are the same.

Then we will focus on the three vertical coordinates.


PageY: Get the vertical coordinates relative to the page origin (if my display resolution is 1920*1080, if I can drag the scroll bar, the pageY value may be much more than 1080)


ScreenY: Obtain the vertical coordinates of the display screen position (if my display resolution is 1920*1080, then screenY can get the maximum value, that is, 1080, even if you drag the scroll bar down, it will not work, the maximum value can only be 1080)


ClientY: Obtain the vertical coordinates relative to the page view (if my display resolution is 1920*1080, the maximum value that clientY can obtain is 1080-(the height of the browser header)








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.