jquery implements simple mobile-side validation form _jquery

Verify that the Red submit button is displayed

Bindblur:function () {//jquery multilevel authentication form
  var n = $ (' #item_name ');
  var p = $ (' #price ');
  var r = $ (' #reserve ');
  Show (Velidate ())//page load after the first validation
  //Three need to verify the validation of the binding field, here can also be written as a code
  //$ (' #item_name ', ' #price ', $ (' # Reserve '). On ({blur:function () {Show (Veridate ())}});
  N.on ({blur:function () {Show (Velidate ())}});
  P.on ({blur:function () {Show (Velidate ())}});
  R.on ({blur:function () {Show (Velidate ())}});
  function Velidate () {//Get the result of the validation
    var flag = true;
    if (n.val () = = "") {flag= false;}
    if (p.val () = = "0" | | p.val () = "") {flag= false;
    if (r.val () = = "0" | | r.val () = "") {flag= false;
    return flag;
  }
  Function Show (flag) {//To reflect validation results to page
    if (flag) {$ (". Down-complete-btn"). CSS ("Background-color", "#b02125");}
    else{$ (". down-complete-btn"). CSS ("Background-color", "#8f8f8f");}
  }
,

Verification, when the user clicks on the submit call, will locate the need to perfect the place

Check:function () {
  var n = $ (' #item_name ');
  var p = $ (' #price ');
  var r = $ (' #reserve ');
  if (n.val () = = "") {N.focus (); return false;}
  if (p.val () = = "0" | | p.val () = = "") {P.focus (); return false;}
  if (r.val () = = "0" | | r.val () = = "") {R.focus (); return false;}
  return true;
},

This section is Ajax commit and commit before calling validation

Postdata:function () {
  $ (". Down-complete-btn"). Click (function () {
    if (Add.check ()) {
      $.ajax ({
        type: ' Post ',
        dataType: ' JSON ',
        data: {
          ID: $ ("#item_id"). Val (),
          name: $ (#item_name). Val (), Price
          : $ ("#price"). Val (),
          photos: $ ("#photos"). Val (),
        },
        cache:false,
        url: '/main/goods/add ',
        Success:function (data) {
          if (data.code==1) {
            alert ("Modified successfully");
          } else{
            console.log (data);
          }
        ,
        error:function () {
          alert (' Network exception ')
  ;}}});
}

Easy_form_validate.js

Require.config ({paths:{"jquery": "./lib/jquery-1.11.1.min", ' icon_upload ': './icon_upload '}});
  Require ([' jquery ', ' Icon_upload '],function () {Add.bindblur ();
Add.postdata ();
});
    var Add = {bindblur:function () {//jquery multilevel verification form var n = $ (' #item_name ');
    var p = $ (' #price ');
    var r = $ (' #reserve '); Show (Velidate ())//page load after the first validation///three validation of the field to verify the binding, here can also be written as a code//$ (' #item_name ', ' #price ', $ (' #reserve ')). On ({
    Blur:function () {Show (Velidate ())}});
    N.on ({blur:function () {Show (Velidate ())}});
    P.on ({blur:function () {Show (Velidate ())}});
    R.on ({blur:function () {Show (Velidate ())}});
      function Velidate () {//Get the result of the validation var flag = true;
      if (n.val () = = "") {flag= false;}
      if (p.val () = = "0" | | p.val () = "") {flag= false;
      if (r.val () = = "0" | | r.val () = "") {flag= false;
    return flag; } function Show (flag) {//To reflect validation results to page if (flag) {$ (". Down-complete-btn"). CSS ("Background-color", "#b02125");} else{$ (". down-complete-btn"). CSS ("BackgroUnd-color "," #8f8f8f ");}
    }, Check:function () {var n = $ (' #item_name ');
    var p = $ (' #price ');
    var r = $ (' #reserve ');
    if (n.val () = = "") {N.focus (); return false;}
    if (p.val () = = "0" | | p.val () = = "") {P.focus (); return false;}
    if (r.val () = = "0" | | r.val () = = "") {R.focus (); return false;}
  return true; }, Postdata:function () {$ (". Complete-btn"). Click (function () {if (Add.check ()) {$.ajax ({type : ' Post ', DataType: ' JSON ', data: {ID: $ ("#item_id"). Val (), Name: $ ("#ite M_name "). Val (), Summary: $ (" #summary "). Text (), Price: $ (#price). Val (), Store: $ (" #store "). Val (), Mobiledetail: $ (" #detail "). Val (), Photos: $ (" #photos "). Val (), Broker Age: $ ("#brokerage"). Val (), Flag: $ ("#flag"). Val (),}, Cache:false, url: '/ Main/goods/add ', success:function (data) {if (data.code==1) {alert ("modified successfully");
            }else{console.log (data);
          }, Error:function () {Alert (' network exception ');
      }
        });
  }
    });
 }
};

Let's take another look at the validation code

<script type= "Text/javascript" >//<!
    [Cdata[$ (function () {/* * * The idea is to add a required tag for each required first, using the each () method. * First create an element in the each () method.
    The created element is then added to the parent element by the append () method.
    * This is the very essence of this, each time the this corresponds to the corresponding INPUT element, and then get the corresponding parent element. * Then add the lost focus event for the INPUT element.
    Then the user name, message verification.
    * Here is a judge is (), if the user name, do the appropriate processing, if the mail to do the corresponding verification. * In the jquery framework, you can also insert an authentic JavaScript code as appropriate. For example, verify that the user name is This.value, and this.value.length.
    Judge the content.
    * Then the verification of the message, appears to use a regular expression. * Then add the KeyUp event and focus event for the INPUT element. It is keyup to do the verification, call the Blur event on the line.
    Triggers the corresponding event with the Triggerhandler () trigger.
    * The final submission of the form when the unified verification * do a good job of the overall and the details of the processing///if required, then add the Red Star logo. 
      $ ("form:input.required"). each (function () {var $required = $ ("<strong class= ' High ' > *</strong>");//Create Element $ (this). Parent (). append ($required);
     Then append it to the document});
       The text box loses focus after $ (' Form:input '). blur (function () {var $parent = $ (this). parent ();
       $parent. Find (". Formtips"). Remove (); Verify user name if ($ (this). is (' #username ') {if (this.value==) |His.value.length < 6) {var errormsg = ' Please enter at least 6-bit username. '
          $parent. Append (' <span class= ' formtips onError ' > ' +errormsg+ ' </span> ');
            }else{var okmsg = ' input correct. '
          $parent. Append (' <span class= ' formtips onsuccess ' > ' +okmsg+ ' </span> '); }//Verify message if ($ (this). is (' #email ') {if (this.value== "") | | (this.value!= "" &&!/.+@.+\. [A-za-z]
           {2,4}$/.test (This.value))) {var errormsg = ' Please enter the correct e-mail address. '
        $parent. Append (' <span class= ' formtips onError ' > ' +errormsg+ ' </span> ');
           }else{var okmsg = ' input correct. '
        $parent. Append (' <span class= ' formtips onsuccess ' > ' +okmsg+ ' </span> ');
    }}). KeyUp (function () {$ (this). Triggerhandler ("blur");
    ). focus (function () {$ (this). Triggerhandler ("blur");
     });//end blur//Submit, final validation. $ (' #send '). Click (function () {$ ("Form:input. Required "). Trigger (' blur ');
        var numerror = $ (' form. OnError '). length;
        if (Numerror) {return false;
     Alert ("Registration is successful, password has been sent to your mailbox, please check.");

    }); 
     Resets $ (' #res '). Click (function () {$ (". Formtips"). Remove ();
}); })//]]> </script>