JQuery Input complete?

$(function(){
var passwordLength = $('#penewpass').val().length;
if(passwordLength == 0){
$('#penewpass').next('.error').css('display', 'inline');
$('#penewpass').change(function(){ $(this).next('.error').css('display', 'none');
});
}
});

JQuery validating email addresses


PHP:
<label class="label" for="email">E-mail: </label>
<input type="text" name="email" id="email" size="48" /><span class="error">please enter a valid e-mail address</span><br />
$regexEmail = '/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/';
var inputEmail = $(this).val( );
var resultEmail = regexEmail.test(inputEmail);
if(!resultEmail){
$(this).next('.error').css('display', inline');
}else
$(this).next('.error').css('display', 'none');
}
});


CSS:
.error {
display: none;
color: #FF0000;
font-size: 0.7em;
margin: 0px 0px 0px 5px;
}

JQuery focus function

Using this jQuery, the cursor can be placed wight into the form element that you would like the user to fill out.

(tabindex defines the order in which these elements should be selected based on clicking the Tab key)

Example 1:
<input type="text" name="user" size="24" tabindex="0"/>
$('input[tabindex="0"]).focus( );

JQuery a semitransparent "shade"

Creating a shaded background:

$('body').append('<div id="modalShade"></div>);

$('#modalShade').css('opacity', 0.7).fadeIn( );

JQuery selecting and binding

The following selects all the anchor (link) tags that have a class="joy" and binds (joins) it to the "click" event:

$('a.joy').click(function( ) {                      

return false;

});

/* Close the click function with the return false; method to keep the link from trying to load another page into the browser */

JQuery select HTML DOM

To select text keyed-in by the user in a textbox eg. <input name="username" type="text" size="48"/>,
use:

$('input[name="username"]')

JQuery tips

To increase the efficiency of jQuery, these are some tips:

  1. Use a class or an id attribute to allow one to identify the item(s) more directly. eg. $('#id_name') or $('.class_name')
  2. Cache the selector that is long and used many times. eg. var link=$("div ul li a"); To use it type: $(link)
  3. Troubleshoot with Firebug (http://getfirebug.com/) and minify your code with the Google Closure Compiler(https://developers.google.com/closure/compiler/)
  4. Troubleshoot 2:Use jsFiddle(http://jsfiddle.net/) to test a jQuery code.