$("#form input, #form select, #form textarea").each(function() {
 data[theFieldName] = theFieldValue;
});

除此之外，你可能想看看serialize();

现在是2019年，有一个更好的方法:

const form = document.querySelector('form');
const data = new URLSearchParams(new FormData(form).entries());

或者如果你想要一个普通的对象

const form = document.querySelector('form');
const data = Object.fromEntries(new FormData(form).entries());

尽管请注意，这将不适用于重复的键，如您从多选和重复的复选框具有相同的名称。

$(form).serializeArray().reduce(function (obj, item) {
      if (obj[item.name]) {
           if ($.isArray(obj[item.name])) {
               obj[item.name].push(item.value);
           } else {
                var previousValue = obj[item.name];
                obj[item.name] = [previousValue, item.value];
           }
      } else {
           obj[item.name] = item.value;
      }

     return obj;
}, {});

它将修复问题:无法与多选择工作。

基于neuront的响应，我创建了一个简单的JQuery方法，在键值对中获取表单数据，但它适用于多选择和name='example[]'的数组输入。

下面是它的用法:

var form_data = $("#form").getFormObject();

您可以在下面找到它的定义及其工作方式的示例。

// Function start $.fn.getFormObject = function() { var object = $(this).serializeArray().reduce(function(obj, item) { var name = item.name.replace("[]", ""); if ( typeof obj[name] !== "undefined" ) { if ( !Array.isArray(obj[name]) ) { obj[name] = [ obj[name], item.value ]; } else { obj[name].push(item.value); } } else { obj[name] = item.value; } return obj; }, {}); return object; } // Function ends // This is how it's used $("#getObject").click( function() { var form_data = $("#form").getFormObject(); console.log(form_data); }); /* Only to make view better ;) */ #getObject { padding: 10px; cursor:pointer; background:#0098EE; color:white; display:inline-block; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <form id="form"> <input type="text" name="text" value="Hola amigo" /> <input type="text" name="text_array[]" value="Array 1" /> <input type="text" name="text_array[]" value="Array 2" /> <input type="text" name="text_array[]" value="Array 3" /> <select name="multiselect" multiple> <option name="option1" selected> option 1 </option> <option name="option2" selected> option 2 </option> </select> <input type="checkbox" name="checkbox" value="checkbox1" checked/> <input type="checkbox" name="checkbox" value="checkbox2" checked/> <input type="radio" name="radio" value="radio1" checked/> <input type="radio" name="radio" value="radio2"/> </form> <div id="getObject"> Get object (check the console!) </div>

我编写了一个库来解决这个问题:JSONForms。它采用一个表单，遍历每个输入并构建一个易于阅读的JSON对象。

假设你有以下表单:

<form enctype='application/json'>
  <input name='places[0][city]' value='New York City'>
  <input type='number' name='places[0][population]' value='8175133'>
  <input name='places[1][city]' value='Los Angeles'>
  <input type='number' name='places[1][population]' value='3792621'>
  <input name='places[2][city]' value='Chicago'>
  <input type='number' name='places[2][population]' value='2695598'>
</form>

将表单传递给JSONForms的encode方法将返回以下对象:

{
  "places": [
    {
      "city": "New York City",
      "population": 8175133
    },
    {
      "city": "Los Angeles",
      "population": 3792621
    },
    {
      "city": "Chicago",
      "population": 2695598
    }
  ]
}

下面是表单的演示。

这里有一个非常简单和简短的解决方案，甚至不需要Jquery。

var formElements=document.getElementById("myForm").elements;    
var postData={};
for (var i=0; i<formElements.length; i++)
    if (formElements[i].type!="submit")//we dont want to include the submit-buttom
        postData[formElements[i].name]=formElements[i].value;