jquery.serializeJSON

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

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

<form id="my-profile">
  
  <input type="text" name="fullName"              value="Mario Izquierdo" />

  
  <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" />

  
  <input type="text" name="jobbies[]"             value="code" />
  <input type="text" name="jobbies[]"             value="climbing" />

  
  <textarea              name="projects[0][name]">serializeJSONtextarea>
  <textarea              name="projects[0][language]">javascripttextarea>
  <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.jstextarea>
  <textarea              name="projects[1][language]">javascripttextarea>
  <input type="hidden"   name="projects[1][popular]" value="0" />
  <input type="checkbox" name="projects[1][popular]" value="1"/>

  
  <select name="selectOne">
    <option value="paper">Paperoption>
    <option value="rock" selected>Rockoption>
    <option value="scissors">Scissorsoption>
  select>

  
  <select multiple name="selectMultiple[]">
    <option value="red"  selected>Redoption>
    <option value="blue" selected>Blueoption>
    <option value="yellow">Yellowoption>
    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"]
}

.......