info/learnxinyminutes-docs
1
0
Fork 0
mirror of https://github.com/adambard/learnxinyminutes-docs.git synced 2025-08-13 18:24:39 +02:00
Code Issues Releases Wiki Activity

[jquery/en] Reorganisation of Part 2 ( Events and Effects ) (#2516)

Browse Source 
* Removes repetition

* [jquery] Better organization for Part 2

* [jquery] Re-added click() event and comment

* [jquery] Better word for 'calling'
This commit is contained in:
Gnomino
2016-10-26 13:29:06 +02:00
committed by ven
parent d674a6744d
commit e7257d0c10
1 changed files with 4 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
jquery.html.markdown
View File

@@ -28,23 +28,17 @@ var square_p = $('p.square') // Selects paragraphs with the 'square' class
/////////////////////////////////// ///////////////////////////////////
// 2. Events and Effects // 2. Events and Effects
// jQuery is very good at handling what happens when an event is triggered
// A very common event used is the ready event on the document // A very common event used is the ready event on the document
// You can use the 'ready' method to wait until the element has finished loading // You can use the 'ready' method to wait until the element has finished loading
$(document).ready(function(){ $(document).ready(function(){
// Code won't execute until the document is loaded // Code won't execute until the document is loaded
}); });
// You can also use defined functions
// jQuery is very good at triggering events
// and also handling what happens when an event is triggered
$('#button').click(); // Fires a click event on $('#button')
$('#button').click(function(){
// Code here gets executed when the #button element is clicked
});
function onAction() { function onAction() {
// This is executed when the event is triggered // This is executed when the event is triggered
} }
$('#btn').click(onAction); // Invokes onAction on click
// Some other common events are: // Some other common events are:
$('#btn').dblclick(onAction); // Double click $('#btn').dblclick(onAction); // Double click
@@ -60,10 +54,6 @@ $('#btn').mousemove(onAction); // When the mouse is moved
$('#btn').mouseenter(onAction); // Mouse enters the element $('#btn').mouseenter(onAction); // Mouse enters the element
$('#btn').mouseleave(onAction); // Mouse leaves the element $('#btn').mouseleave(onAction); // Mouse leaves the element
// You can also use an anonymous function
$('#btn').hover(function(){
// Executed on hover
});
// These can all also trigger the event instead of handling it // These can all also trigger the event instead of handling it
// by simply not giving any parameters // by simply not giving any parameters
@@ -114,7 +104,7 @@ tables.animate({margin-top:"+=50", height: "100px"}, 500, myFunction);
// 3. Manipulation // 3. Manipulation
// These are similar to effects but can do more // These are similar to effects but can do more
$('div').addClass('div') // Adds class div to all div taming-slim-20 $('div').addClass('div'); // Adds class div to all div taming-slim-20
// Common manipulation methods // Common manipulation methods
$('p').append('Hello world'); // Adds to end of element $('p').append('Hello world'); // Adds to end of element