◽ HTML & CSS & JS, jQuery

[jQuery - 기능 - (7) ] .serialize() → 폼 요소 집합을 인코딩 - jQuery제공 메서드


.serialize() 함수

  이 함수는 form태그 안에 포함된 input value를 name과 폼형태로 아래의 그림과 같이 키값=값&키값=값 ... 으로 만들어준다.


 

 


1. type="text"

alert()로​ $("Form").serialize() 를 찍어보면, name1=value1&name2=value2의 형식으로 나온다.

참고 : serializeArray() 도 있는데, 이걸로 사용하면, serialize와 동일하지만 형식은 {name1=value1}, {name2=value2}의 형태로 반환된다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<form name='Form'>
 
  <input type='text' name='name1' value='value1'>
 
  <input type='text' name='name2' value='value2'>
 
</form>
 
 
<script>
$.ajax({
 url: ajax_url
 ,type: "POST"
 ,data : $("Form").serialize()
 ,success: function(json){
 }
});
</script>
olor Scripter

 

 


 

 


2. type="checkbox"

 checkbox의 경우 checked가 된 애들만 form형태로 "test=1&test=2"와 같이 생성된다.

1
2
3
4
5
6
7
8
9
10
11
<form>
    <input type="checkbox" name="test" value="1" checked>
    <input type="checkbox" name="test" value="2" checked>
    <input type="checkbox" name="test" value="3">
</form>
 
 
<script>
    var log = $('[name=test]').serialize();
    console.log(log); //test=1&test=2
</script>
cs

 


 

 

푸터바