jquery Learning (4-1)

Source: Internet
Author: User


set up the form control, mainly including ' Verify mailbox ', ' Determine if input is empty ', ' Set TabIndex property '

$ (document). Ready (function () {/* Modal windows */$ (' A.modal '). Click (function () {var modalid = $ (this). attr (' rel '); Get the name of the modal/* fade in the modal window and add a close button to it */$ (' # ' + mo dalid). FadeIn (). prepend (' <a href= ' # "class=" close "></a> "); /* * Define the margins so, the modal is centered properly on the screens * we add 80px to the height/ Width to accomodate for the padding and border * Width defined in the CSS */var modalmargintop = (        $ (' # ' + modalid). Height () + 80)/2;        var modalmarginleft = ($ (' # ' + modalid). Width () + 80)/2;            /* Apply the margins to the modal window */$ (' # ' + modalid). css ({' margin-top ':-modalmargintop,        ' Margin-left ':-modalmarginleft}); /* Fade in the shade! (Tired of the cheesy jokes yEt?) */$ (' body '). Append (' <div id= "Modalshade" ></div> "); Add the shade layer to bottom of the body $ (' #modalShade '). CSS (' opacity ', 0.6). FadeIn ();  Set the opacity with JQuery to avoid all of the nasty CSS needed for IE/* Focus on the first form input *//** Syntax: $ (selector). The each (function (index,element)) * method specifies the function to run for each matching element, and returns false to stop the loop early.        *//**: Input $ (": input") all <input> elements *: All visible elements *//** I start from zero */$ (': Input:visible '). each (function (i,e) {         /* * Loop through all visible elements * and assign a TabIndex value to each * starting with 0        */$ (E). attr (' tabindex ', + + i);        });        /* Apply the Focus */$ (' input[tabindex= '). focus (); return false;    Keep the link from acting naturally}); /* Close the modal and pull down the shade */$ (' A.close, #modalShade '). Live (' click ', function () {//ClickIn G on the close or shade layer var thisModalid = $ (' A.close '). Parent (). attr (' id ');  $ (' #modalShade, # ' +thismodalid). FadeOut (function () {$ (' #modalShade, A.close '). Remove ();        Remove the shade and the Close button});    return false;        });    /* Make sure this password is not blank */$ (function () {var passwordlength = $ (' #penewpass '). Val (). length; if (Passwordlength = = 0) {/* Make sure warning are on if the length is zero *//** method returns the next sibling element of the element, and returns only one element */$ (' #penewp    ('. Error '). CSS (' Display ', ' inline '); /* When the password changes (and the length grows) Turn off error */$ (' #penewpass '). Change (function () {$ (this). NE    XT ('. Error '). CSS (' Display ', ' none ');    });    }    }); /* Validate e-mail address in register form */$ (function () {/* get length of email */var emaillength = $ (' #emai    L '). Val (). length;    if (Emaillength = = 0) {$ (' #email '). Next ('. Error '). CSS (' Display ', ' inline '); $ (' #email '). Change (function () {var regexemail =/^[a-za-z0-9._-][email protected][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 ', ' none ');    }    }); }    });});

There's still a lot of usage worth learning.

jquery Learning (4-1)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.