TechiWarehouse.Com


Top 3 Products & Services

1.
2.
3.


Warning: date(): It is not safe to rely on the system's timezone settings. You are *required* to use the date.timezone setting or the date_default_timezone_set() function. In case you used any of those methods and you are still getting this warning, you most likely misspelled the timezone identifier. We selected the timezone 'UTC' for now, but please set date.timezone to select your timezone. in /home/santanaservices/public_html/techiwarehouse.com/cms/engine.php on line 37

Dated: Dec. 21, 2012

Related Categories

JavaScript Programming

Events

These methods are used for registering user actions in a browser and acting after the same ones, and also as a way to manipulate registered actions.

jQuery supports the following events:

BLUR
- when an element loses focus

FOCUS
- when an element gets focus

FOCUSIN
- when a child element gets focus

FOCUSOUT
- when a child element loses focus

LOAD
- when an element is completely loaded (supported elements: img, script, frame, iframe, window)

RESIZE
- when a window object changes size

SCROLL
- when the user moves his scroller (works on a window object but also on all elements that have CSS overflow turned on)

UNLOAD
- is linked to the window element and is triggered when the user leaves the page

CLICK
- when the element is clicked

DBLCLICK
- when the element is double clicked

MOUSEDOWN
- when the cursor is above the element and the left mouse button is pressed

MOUSEUP
- when the cursor is above the element and the left mouse button is released

MOUSEMOVE
- when the cursor is moving inside the element

MOUSEOVER
- when the passes over the element

MOUSEOUT
- when the cursor leaves the element field

MOUSEENTER
- when the cursor enters the element field

MOUSELEAVE
- same as mouseout

CHANGE
- when the value of the element is changed (supported elements: input, textarea, select)

SELECT
- when a user selects a text inside the element (supported elements: input i textarea)

SUBMIT
- when a user tries to send a form (supports only form element)

KEYDOWN
- when the user presses any key on the keyboard. It can be linked to any element, but that elements must be in focus

KEYPRESS
- same as keydown, only it doesn’t register auxiliary keys (shift, ctrl, alt...)

KEYUP
- when a user presses and releases any button on the keyboard. It can be linked to any element, but that element must be in focus

ERROR
- when elements, like pictures, don’t load properly

 

.BIND()
Binds a function to execute a certain element in reaction to an action that the user made.

$('#myElement').bind('click', function(){        alert('User clicked on button');     });

 

.LIVE()
Does the same as the .bind() method , only it connects events to all elements added in the future. For example, if we link a certain event that has the class my class, and will later add a second element with the same class, .bind() element will not give him that event, but .live() will.

 $('#myElement').bind('click', function() {       alert('User clicked on button');    });

 

.ONE()
Links a certain event to an element that will be executed only once.

 /* the function will be executed only after the first click.   After every next click nothing will happen */       $('#myElement').one('click', function() {    alert('User clicked on button'

 

.DIE()
Removes all or a certain event from an element. It can also delete a certain function that has been assigned to an element through a event.

// removes all events    $('#myElement').die();      // removes all click events    $('#myElement').die('click');      // removes acertain function that has been previously assigned on a click event    $('#myElement').die('click', someFunction);

 

All above mentioned events can be used with .bind(), .live(), .one() and .die() methods or as independent methods (example: .click(), .focus()...)

 

.READY()
Starts when DOM is completely loaded. Always use this method when you are starting your functions. It links exclusively on a document object.

 $(document).ready(function() {       // your functions are called here });

 

jQuery Events

 

 

This was the fourth part of the lesson about jQuery read the next part of the jQuery tutorial in Monday.

And other parts can be found here:

- First part of the jQuery tutorial

- Second part of the jQuery tutorial

- Third part of the jQuery tutorial

 

 

Now that you've gotten free know-how on this topic, try to grow your skills even faster with online video training. Then finally, put these skills to the test and make a name for yourself by offering these skills to others by becoming a freelancer. There are literally 2000+ new projects that are posted every single freakin' day, no lie!


Previous Article

Next Article




Facebook