Found 766 Articles for JQuery

jQuery Traversing Descendants

AmitDiwan
Updated on 30-Dec-2019 07:30:10

75 Views

To traverse and find descendants of an element, jQuery has the following methods: children() and find().children() methodThe childreb() method in jQuery is used to return the direct children of the selected element (only a single level of direct children). Let us see an example−Example Live Demo div {    width:600px; } .demo * {    display: block;    border: 2px solid orange;    color: blue;    padding: 10px;    margin: 10px; }    $(document).ready(function(){       $("div").children().css({"color": "gray", "border": "3px dashed blue"});    }); great-great-grandparent great-grandparent grandparent parent span ... Read More

jQuery submit() with Examples

AmitDiwan
Updated on 30-Dec-2019 07:23:36

369 Views

The submit() method in jQuery is used to trigger the submit event. It occurs when a form is submitted.SyntaxThe syntax is as follows −$(selector).submit(func)Above, the func parameter is the function to run when the submit event is triggeredExampleLet us now see an example to implement the jQuery submit() method − Live Demo    $(document).ready(function() {       $("form").submit(function(){          alert("Form Submitted");       });    }); Login Enter Username: Enter Password: OutputThis will produce the following output−Click the “Submit” button −

jQuery mouseup() with Examples

AmitDiwan
Updated on 30-Dec-2019 07:19:20

254 Views

The mouseup() method in jQuery is used to trigger the mouseup event. The event occurs when the left mouse button is releases over the selected element.SyntaxThe syntax is as follows−$(selector).mousedown(func)Above, func is the function to run when mouseup event triggers.ExampleLet us now see an example to implement the jQuery mouseup() method − Live Demo    $(document).ready(function(){       $("h2").mouseup(function(){          $(this).after("Mouse up (mouse button is released).");       });       $("h2").mousedown(function(){          $(this).after("Mouse down (mouse button is pressed down).");       });    }); ... Read More

jQuery mousedown() with Examples

AmitDiwan
Updated on 30-Dec-2019 07:13:25

290 Views

The mousedown() method in jQuery is used to trigger the mousedown event. The event occurs when the left mouse button is pressed down over the selected element.SyntaxThe syntax is as follows −$(selector).mousedown(func)Above, func is the function to run when mousedown event triggers.ExampleLet us now see an example to implement the jQuery mousedown() method − Live Demo    $(document).ready(function(){       $("h2").mouseup(function(){          $(this).after("Mouse up (mouse button is released).");       });       $("h2").mousedown(function(){          $(this).after("Mouse down (mouse button is pressed down).");       });    }); ... Read More

jQuery Traversing Filtering

AmitDiwan
Updated on 30-Dec-2019 07:08:44

148 Views

Filtering methods in jQuery include eq(), filter(), not(), etc. Let us see some of them here−not() methodThe not() method in jQuery is used to return elements that do not match specific criteria.ExampleLet us see an example to implement the jQuery not() method− Live Demo    $(document).ready(function(){       $("button").click(function(){          $("h2").not(".demo").css("color", "orange");       });    }); h2 { color: blue; } Student Info This is a demo text. Exam Info This is a demo text. Teacher's Info This is a demo text. Click me OutputThis ... Read More

Difference between Backbone.js and Jquery

Ayush Gupta
Updated on 27-Nov-2019 10:00:04

185 Views

Backbone is an MV* framework while jQuery is a DOM toolkit.With Backbone, you represent data as Models, which can be created, validated, destroyed, and saved to the server. Whenever a UI action causes an attribute of a model to change, the model triggers a "change" event; all the Views that display the model's state can be notified of the change so that they are able to respond accordingly, re-rendering themselves with the new information.While jQuery is a solid API for querying the DOM with support for event handling, deferred objects, and animations. It is best suited for things like querying ... Read More

jQuery focusout() with Example

AmitDiwan
Updated on 12-Nov-2019 12:50:57

688 Views

The focusout() method in jQuery occurs when an element loses focus.SyntaxThe syntax is as follows −$(selector).focusout(function)ExampleLet us now see an example to implement the jQuery focusout() method −    .demo {       color: blue;    }    $(document).ready(function(){       $("input").focusin(function(){          $("p").html("focusin event triggered");       });       $("input").focusout(function(){          $("p").html("focusout event triggered");       });    }); Student Details Student Name: OutputThis will produce the following output −Now, click inside to get focus −Click outside to lose focus −

jQuery addClass() with Example

AmitDiwan
Updated on 12-Nov-2019 12:48:53

445 Views

The addClass() method in jQuery is used to add one or more class names to the selected elements.ExampleLet us now see an example to implement the jQuery addClass() method −    .demo * {       display: block;       border: 3px dashed red;       padding: 3px;       margin: 25px;    }    .one {       border: 2px solid yellow;    }    $(document).ready(function(){       $("span.test").next().addClass("one");    }); Heading One This is our demo text in div. child grandchild grandchild grandchild ... Read More

jQuery finish() with Example

AmitDiwan
Updated on 12-Nov-2019 12:44:51

130 Views

The finish() method in jQuery is used to stop the currently-running animations. It removes all queued animations and completes all animations for the selected elements.SyntaxThe syntax is as follows −$(selector).finish(queue)Above, the queue parameter is the name of the queue to stop animation.ExampleLet us now see an example to implement the jQuery finish() method −    div {       background:orange;       height:200px;       width:200px;       padding: 5px;    }    $(document).ready(function(){       $("#begin").click(function(){          $("div").animate({height: 450}, 2000);       });   ... Read More

jQuery focusin() with Example

AmitDiwan
Updated on 12-Nov-2019 12:40:28

138 Views

The focusin() method in jQuery occurs when an element gets focus.SyntaxThe syntax is as follows −$(selector).focusin(function)ExampleLet us now see an example to implement the jQuery focusin() method −    .demo {       color: blue;    } $(document).ready(function(){    $("input").focusin(function(){       $("p").html("focusin event triggered");    });    $("input").focusout(function(){       $("p").html("focusout event triggered");    }); }); Student Details Student Name: OutputThis will produce the following output −Now, click inside to get focus −Click outside to lose focus −

Advertisements