jQuery: 10 Most Useful Scripts You Should Know About

jQuery is a JavaScript library similar to Prototype that helps developers write cross-browser compatible applications faster. If you’re used to writing plain JavaScript code you’re definitely familiar with implementation issues and hacks you have to employ because of browser differences. jQuery tries to level the ground, so to speak, so you can concentrate on making awesome applications.

 

1. Reload a page

location.reload();

2. Selected option value of a select tag

var optionValue = $('#selectid option:selected').val();

3. Is the checkbox checked?

var checkbox = $('#mycheckbox').is(':checked'); // This returns a true or false

4. Trigger a form submission from an element within a form. This is helpful where there are numerous forms on a page

$(this).closest('form').submit;

5. Open  and close a content block by sliding up or down the page

$('div#content_block').slideToggle();

6. Respond to a click on a link but prevent page reload or user leaving pege

$('a.clicked_link').preventDefault();

7. Add CSS class to HTML tag

$('div.login').addClass('error-login');

8. Scroll to a section on the page

$('html, body').animate({
 scrollTop: $("#destination").offset().top
 }, 1000);

Checkout API reference here: http://api.jquery.com/scrollTop/

9. Insert content after a block of content:

$('div.box1').after('<div>Box 2</div>');

10. Append some text to an existing block of content

$('<p>I am the last paragraph.</p>').appendTo( $('div.content_block') );

When working with jQuery always remember to check the version you have so you’re not stuck with deprecated code that may not work properly. Refer to API documentation often to learn more about jQuery and how to use it.
I hope this list is useful to you. Let’s keep learning!

2013-04-14T15:35:42-05:00
Call Now ButtonLet's Talk