I. Jquery+ajax form data serialization
1<! DOCTYPE html>234<meta charset= "UTF-8" >5<title>Title</title>67<body>8<p id= "Results" ><b>results: </b> </p>9<form>Ten<p> Address </p> One<select name= "Address" > A<option>Guangdong</option> -<option>Beijing</option> -<option>Shanghai</option> the</select> -<p> Hobbies </p> -<input type= "checkbox" name= "hobby" value= "soccer"/> Soccer -<input type= "checkbox" name= "hobby" value= "Blue Ball" checked= "checked"/> Blue Ball +<p> Sex </p> -<input type= "Radio" name= "Sex" value= "male" checked= "checked"/> Male +<input type= "Radio" name= "Sex" value= "female"/> Female A<input type= "Radio" name= "Sex" value= "secrecy"/> secrecy at</form> -</body> - -<script src= "Lib/jquery-1.12.2.js" ></script> -<script> - //Serialize sequence Table Form data in // return Result: address=guangdong&hobby= Blue ball &sex=male - //how serialization forms work: to //1. Locate the form item with the name attribute in the form partition. + //2. Get a value for each name - //3. Stitching the name attribute and corresponding value into a string theConsole.log ($ ("form"). Serialize ()); *$ ("#results"). Append ($ ("form")). Serialize ()); $</script>
02_jq_ajax_post.php
1<?PHP2 /**3 * Created by Qinpeizhou.4 * DATE:2017/11/105 * time:15:036 * Email: [Email protected]7 */8Header (' Content-type:text/html;charset=utf-8; ');9 //Echo ' Success, you successfully get the data from the PHP server;Ten$uName = $_post[' UserName ']; One$users = ["Jack", ' Rose ', ' Tom ']; A$isExist =In_array ($uName, $users); - if($isExist) { -echo "This account has been registered, for another try"; the}Else{ -echo "You can register"; -}
Examples of form serialization:
<! DOCTYPE html>. tips{color:red; } </style>/*$ (' #userName '). blur (function () {/!** * $.ajax ({}); * URL server address * *!/var txt = $ (this). Val (); $.ajax ({type: ' GET ', url: ' 01_jq_ajax_get.php ', data:{username:txt }, Success:function (res) {$ (' #tips '). HTML (res); } }); });*/ $(' #submitBtn '). Click (function () { varUsertext = $ (' #userName '). Val (); if($.trim (usertext). length==0){ $(' #tips '). HTML ("User name cannot be empty"); } $.ajax ({type:' POST ', URL:' 02_jq_ajax_post.php ', Data: $ (' #loginForm '). Serialize (),//serialization of form dataSuccessfunction(RES) {$ ("#tips"). HTML (res); } }); //default behavior of block submit button return false; });</script>
Ajax--serialize application of form data serialization