jQuery ajax - метод serializeArray()

Руководство по jQuery Ajax

пример

вывод результатов сериализации значений формы в виде массива:

$("button").click(function(){
  x=$("form").serializeArray();
  $.each(x, function(i, field){
    $("#results").append(field.name + ":" + field.value + " ");
  );
);

попробуйте сами

определение и использование

serializeArray() метод создает массив объектов,serializing the values of form elements (names and values) by serializing the form values.

Вы можете выбрать один или несколько элементов форм (например, input и/или textarea), или сам элемент form.

грамматика

$(выборщик).serializeArray()

подробное описание

serializeArray() метод сериализует элементы форм (аналогично .serialize() методвозвращается JSON структура данных.

Внимание:Этот метод возвращает JSON объект, а не JSON строку. Для строковой сериализации необходимо использовать плагин или сторонний библиотеку.

Возвращаемый JSON объект состоит из массива объектов, каждый из которых содержит один или два параметра - name и value (если value не пуст). Например:

[ 
  {name: 'firstname', value: 'Hello'}, 
  {name: 'lastname', value: 'World'},
  {name: 'alias'}, // значение пусто
]

.serializeArray() метод использует стандарты W3C о успешные контролыстандартам (эффективные контролы) для определения, какие элементы должны быть включены.特别指出，элементы не должны быть отключены (отключенные элементы не включаются), и у элементов должны быть атрибуты name.

Этот метод позволяет выполнять операции с объектами, выбранными отдельно для элементов форм, таких как <input>, <textarea> и <select>. Однако, более удобный способ - это напрямую выбирать сам тег <form> для выполнения операции сериализации. 

$("form").submit(function() {
  console.log($(this).serializeArray());
  return false;
);

Данное код generates следующую структуру данных (предполагается, что браузер поддерживает console.log):

[
  {
    name: a
    value: 1
  },
  {
    name: b
    value: 2
  },
  {
    name: c
    value: 3
  },
  {
    name: d
    value: 4
  },
  {
    name: e
    value: 5
  }
]

Пример

Получение содержимого формы и вставка его в веб-страницу:

HTML 代码：

<p id="results"><b>Results:</b> </p>
<form>
  <select name="single">
    <option>Single</option>
    <option>Single2</option>
  </select>
  <select name="multiple" multiple="multiple">
    <option selected="selected">Multiple</option>
    <option>Multiple2</option>
    <option selected="selected">Multiple3</option>
  </select><br/>
  <input type="checkbox" name="check" value="check1"/> check1
  <input type="checkbox" name="check" value="check2" checked="checked"/> check2
  <input type="radio" name="radio" value="radio1" checked="checked"/> radio1
  <input type="radio" name="radio" value="radio2"/> radio2
</form>

jQuery 代码：

var fields = $("select, :radio").serializeArray();
jQuery.each( fields, function(i, field){
  $("#results").append(field.value + " ");
);

Руководство по jQuery Ajax