jQuery ajax - serialize() 메서드

예제

시리얼라이즈된 폼 값의 결과를 출력합니다:

$("button").click(function(){
  $("div").text($("form").serialize());
});

직접 시험해 보세요

정의와 사용법

serialize() 메서드는 폼 값을 시리얼라이즈하여 URL 인코딩 텍스트 문자열을 생성합니다.

한 개나 여러 개의 폼 요소(예: input 및/또는 텍스트 박스)나 폼 요소 자체를 선택할 수 있습니다.

시리얼라이즈된 값은 AJAX 요청을 생성할 때 URL 쿼리 문자열에 사용할 수 있습니다.

문법

$(선택자).serialize()

상세 설명

.serialize() 메서드는 표준 URL 인코딩으로 표현된 텍스트 문자열을 생성합니다. 그의 작업 대상은 폼 요소 셋의 jQuery 객체입니다.

폼 요소는 여러 가지 유형이 있습니다:

<form>
  <div><input type="text" name="a" value="1" id="a" /></div>
  <div><input type="text" name="b" value="2" id="b" /></div>
  <div><input type="hidden" name="c" value="3" id="c" /></div>
  <div>
    <textarea name="d" rows="8" cols="40">4</textarea>
  </div>
  <div><select name="e">
    <option value="5" selected="selected">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
  </select></div>
  <div>
    <input type="checkbox" name="f" value="8" id="f" />
  </div>
  <div>
    <input type="submit" name="g" value="Submit" id="g" />
  </div>
</form>

.serialize() 메서드는 선택된 개별 폼 요소의 jQuery 객체를操作할 수 있습니다. 예를 들어 <input>, <textarea> 및 <select>입니다. 그러나 <form> 태그 자체를 시리얼라이즈하는 것이 일반적으로 더 쉽습니다:

$('form').submit(function() {
  alert($(this).serialize());
  return false;
});

표준 쿼리 문자열을 출력합니다:

a=1&b=2&c=3&d=4&e=5

주석:오직 "성공된 컨트롤"만 문자열로 시리얼라이즈합니다. 폼을 버튼을 사용하지 않고 제출하면 제출 버튼의 값을 시리얼라이즈하지 않습니다. 폼 요소의 값이 시리얼 문자열에 포함되려면 요소는 name 속성을 사용해야 합니다.