jQuery
Event Methods
Events
– All the end users actions
that a web page can responds called as 'events'.
Ex
- * moving a mouse over an element
*
select a check box
*
click a button
General
examples of DOM events -
Mouse
Events : click,
dblclick, mouseenter, mouseleave
Keyboard
Events : keypress,
keydown, keyup
Form
Events : submit,
change, focus, blur
Document
Window events : load,
resize, scroll, unload
Few
Events are listed below.
click()
The
click() function is executed when the user clicks on the HTML
element.
dblclick()
The
dblclick() function is executed when the user double-clicks on the
HTML element.
mouseenter()
The
function is executed when the mouse pointer enters the HTML element.
hover()
The
hover() method takes two functions and is a combination of the
mouseenter() and mouseleave() methods.
The
first function is executed when the mouse enters the HTML element,
and the second function is executed when the mouse leaves the HTML
element.
focus()
The
function is executed when the HTML form field gets focus.
blur()
The
function is executed when the HTML form field loses focus.
$(function(){
$("button").dblclick(function(){
$("p").hide();
});
$("#highlight").click(function(){
$("p").show();
$("ul").addClass("redfont");
$(".h1Gray").hide();
$("ul
li:first").hide();
$("ul
li:last").hide();
});
$("#p1").mouseenter(function(){
alert("You
entered p1 tag");
});
$("#p1").mouseleave(function(){
alert("You
now leave p1 tag");
});
$("#p1").mousedown(function(){
alert("Mouse
down over p1 tag");
});
$("#p1").mouseup(function(){
alert("Mouse
up over p1 tag");
});
$("input").focus(function(){
$(this).css("background-color","#cccccc");
});
$("input").blur(function(){
$(this).css("background-color","#ffffff");
});
});
