jquery.serializeJSON

来源:互联网 发布:js选项卡代码理解 编辑:程序博客网 时间:2024/06/18 07:50

Serialize an HTML Form to a JavaScript Object, supporting nested attributes and arrays.

项目地址https://github.com/marioizquierdo/jquery.serializeJSON

<form id="my-profile">  <!-- simple attribute -->  <input type="text" name="fullName"              value="Mario Izquierdo" />  <!-- nested attributes -->  <input type="text" name="address[city]"         value="San Francisco" />  <input type="text" name="address[state][name]"  value="California" />  <input type="text" name="address[state][abbr]"  value="CA" />  <!-- array -->  <input type="text" name="jobbies[]"             value="code" />  <input type="text" name="jobbies[]"             value="climbing" />  <!-- textareas, checkboxes ... -->  <textarea              name="projects[0][name]">serializeJSON</textarea>  <textarea              name="projects[0][language]">javascript</textarea>  <input type="hidden"   name="projects[0][popular]" value="0" />  <input type="checkbox" name="projects[0][popular]" value="1" checked />  <textarea              name="projects[1][name]">tinytest.js</textarea>  <textarea              name="projects[1][language]">javascript</textarea>  <input type="hidden"   name="projects[1][popular]" value="0" />  <input type="checkbox" name="projects[1][popular]" value="1"/>  <!-- select -->  <select name="selectOne">    <option value="paper">Paper</option>    <option value="rock" selected>Rock</option>    <option value="scissors">Scissors</option>  </select>  <!-- select multiple options, just name it as an array[] -->  <select multiple name="selectMultiple[]">    <option value="red"  selected>Red</option>    <option value="blue" selected>Blue</option>    <option value="yellow">Yellow</option>    </select></form>

JavaScript:

$('#my-profile').serializeJSON();// returns =>{  fullName: "Mario Izquierdo",  address: {    city: "San Francisco",    state: {      name: "California",      abbr: "CA"    }  },  jobbies: ["code", "climbing"],  projects: {    '0': { name: "serializeJSON", language: "javascript", popular: "1" },    '1': { name: "tinytest.js",   language: "javascript", popular: "0" }  },  selectOne: "rock",  selectMultiple: ["red", "blue"]}
.......
0 0
原创粉丝点击