jQuery Event Methods

Hello, today I'd like to show how to get started with jQuery Event Methods.  Im going to introduce several commonly used jQuery event methods such as: click(),  dblclick(),  mouseenter(),  mouseleave(),  mousedown(),  mouseup(),  hover().


1. click()
The function click() is executed when the user clicks on the HTML element.
Example: 
$("p.click").click(function(){
        $(this).hide();
    });
2. dblclick()
This function is executed when the user double-clicks on the HTML element.
Example:
$("p.dbClick").dblclick(function(){
        $(this).hide();
    });

3. mouseenter()
mouseenter() is executed when the mouse pointer enters the HTML element.
Example:
$("#p1").mouseenter(function(){
        $(this).addClass("yellowColor");
    });

4. mouseleave()
The function is executed when the mouse pointer leaves the HTML element.
Example:
$("#p1").mouseleave(function(){
        $(this).removeClass("yellowColor");
    });

5. mousedown()
The function is executed, when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element.
Example:
$("#p3").mousedown(function(){
        alert("Mouse down Hoan handsome");
    });

6. mouseup()
The function mouseup() is executed, when the left, middle or right mouse button is released, while the mouse is over the HTML element.
Example:
$("#p2").mouseup(function(){
        alert("You has Mouse up over p2!");
    });

7. hover()
The hover() method takes two functions and is a combination of the mouseenter() and mouseleave() methods.
Example:
$("#p4").hover(function(){
    alert("You entered p4!");
},
function(){
     alert("Bye! You now leave p4!");
 });

To sum up, the above methods are very basic one that you would be quickly involved. There are wide range of jQuery events out there, I hope that you can use each jQuery methods on your way efficiently. We can refer the full example code here.  https://jsfiddle.net/quanghoan/q20mcu8q/3/

Thank for reading!
If you liked this article

Let's subscribe the updates of Scuti!
Share on Google Plus

About Quang Hoan

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment
    Facebook Comment

3 Comments:

  1. There are so many fun and exciting Things to do and experience around the world that I thought I'd put together a list of my favourite things to do for all travelers

    ReplyDelete