<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <form id="myform"> <table> <tr> <td>姓名:</td> <td> <input type="text" name="name" value="旺旺"/> </td> </tr> <tr> <td>性別:</td> <td> <input type="radio" name="sex" value="男" checked> 男 <input type="radio" name="sex" value="女"> 女 </td> </tr> <tr> <td>年齡:</td> <td> <select name="age"> <option value="10">10</option> <option value="20" selected>20</option> <option value="30">30</option> </select> </td> </tr> <tr> <td>愛好:</td> <td> <input type="checkbox" value="read" name="hobby" checked>讀書 <input type="checkbox" value="music" name="hobby" checked>音樂 <input type="checkbox" value="draw" name="hobby" checked>畫畫 <input type="checkbox" value="sport" name="hobby">運動 </td> </tr> <tr> <td colspan="2"> <input type="button" id="submitBtn" value="提交" /> </td> </tr> </table> </form> <script> /**序列化表單,多個value用數組存放**/ $.fn.serializeObject = function() { var o = {}; var arr = this.serializeArray(); $.each(arr,function(){ if (o[this.name]) { //返回json中有該屬性 if (!o[this.name].push) { //將已存在的屬性值改成數組 o[this.name] = [ o[this.name] ]; } o[this.name].push(this.value || ''); //將值存放到數組中 } else { //返回json中沒有有該屬性 o[this.name] = this.value || ''; //直接將屬性和值放入返回json中 } }); return o; } /**序列化表單,多個value用逗號隔開**/ $.fn.serializeObject2 = function() { var o = {}; var arr = this.serializeArray(); $.each(arr,function(){ if (o[this.name]) { //返回json中有該屬性 o[this.name]=o[this.name]+','+(this.value || '');//序列化表單,多個value用逗號隔開 } else { //返回json中沒有有該屬性 o[this.name] = this.value || ''; //直接將屬性和值放入返回json中 } }); return o; } /**初始化測試**/ $(function() { $("#submitBtn").click(function() { var params = $("#myform").serializeObject(); //將表單序列化為JSON對象 console.info(params); var params2 = $("#myform").serializeObject2(); //將表單序列化為JSON對象 console.info(params2); }); var json={'a':'a我的#+~','b':'b','c':'c'}; var jsonStr=JSON.stringify(json);//json轉字符串 var json2=JSON.parse(jsonStr);//字符串轉json console.info(jsonStr); console.info('encodeURI:\n'+encodeURI(jsonStr));//轉碼非url的字符 console.info('encodeURIComponent:\n'+encodeURIComponent(jsonStr));//轉碼所有的特殊字符 /*encodeURIComponent() 函數 與 encodeURI() 函數的區別之處,前者假定它的參數是 URI 的一部分(比如協議、主機名、路徑或查詢字符串)。因此 encodeURIComponent() 函數將轉義用於分隔 URI 各個部分的標點符號。*/ console.info(json2); }) </script> </body> </html>