<! DOCTYPE html>"Utf-8"/> <title>jquery form serialization to JSON object </title> <script src="//cdn.bootcss.com/jquery/3.0.0/jquery.min.js"></script> </script> ""Name="Post_form"Id="Post_form">Name:<input type="name"Name="name"Value="Wang"> <br/> Gender: <input type="Radio"Name="Sex"Value="male" checked> Male <input type="Radio"Name="Sex"Value="female">female<br/> Hobby: <input type="checkbox"Name="loves"Value="Basketball"> Basketball <input type="checkbox"Name="loves"Value="Football">Football<br/> Hometown:<SelectName="Province"> <option value="Shanghai"> Shanghai </option> <option value="Beijing"> Beijing </option> <option value="Shenzhen"> Shenzhen </option> </Select> </form> <div id="result"style="margin-top:20px;width:600px;height:100px;border:1px solid #f00;"> </div> <div> <button id="Send"> Send </button> </div> <script>//jquery form serialization converted to JSON object(function ($) {$.fn.serializejson=function () {varserializeobj={}; vararray= This. Serializearray (); varStr= This. Serialize (); $ (array). each (function () {if(serializeobj[ This. Name]) { if($.isarray (serializeobj[ This. Name])) {serializeobj[ This. Name].push ( This. Value); }Else{serializeobj[ This. name]=[serializeobj[ This. Name], This. value]; } }Else{serializeobj[ This. name]= This. Value; } }); returnSerializeobj; }; }) (JQuery); $ (document). Ready (function () {$ ("#send"). Click (function () {varpost_data=$ ("#post_form"). Serializejson ();//Serialization of Forms$("#result"). HTML (json.stringify (post_data)); }) }) </script> </body>Operation Result:
jquery implements form form serialization conversion to JSON object feature example