[jQuery] value 값 가져오기 / 설정하기

 

form 요소의 값 가져오기 / 설정하기

 

1) id 이용

<form>
	<input type="text" id="name" value="test">
	<input type="text" id="tel" value="010-0000-0000">
</form>

<script type="text/javascript">
	$(document).ready(function(){
    	// 값 가져오기(get)
    	var name = $('#name').val(); 
    	// 값 설정하기(set)
        $('#tel').val('010-1111-1111');
    };
</script>

 

 

2) class 이용

<form>
	<input type="text" class="name_class" value="test">
	<input type="text" class="tel_class" value="010-0000-0000">
</form>

<script type="text/javascript">
	$(document).ready(function(){
    	// 값 가져오기(get)
    	var name = $('.name_class').val(); 
    	// 값 설정하기(set)
        $('.tel_class').val('010-1111-1111');
    };
</script>

 

 

 

3) name 이용

<form>
	<input type="text" name="name_name" value="test">
	<input type="text" name="tel_name" value="010-0000-0000">
</form>

<script type="text/javascript">
	$(document).ready(function(){
    	// 값 가져오기(get)
    	var name = $('input[name=name_name]').val(); 
    	// 값 설정하기(set)
        $('input[name=tel_name]').val('010-1111-1111');
    };
</script>

 

 

3가지 방법 모두 결과는 같다

- var형의 name변수에는 test라는 값이 들어감

- tel의 값은 010-0000-0000에서 010-1111-1111 으로 바뀜

---

value값을 이용하여 요소를 찾을 수도 있다

ex) value값이 test인 input태그의 id 가져오기

$('input[value=test]').attr("id");

 

그러나 하나씩 찾기 힘들때도 있으므로

ex) value값이 test이고 id에 123이 포함된 input태그의 id 가져오기

$('input[value=test][id*=123]').attr("id");

---

 

참고한 글

 

[jQuery] input value 가져오기 (tistory.com)

[jQuery] input value 가져오기

 

[JQUERY] Val()함수 Value값 가져오기,설정하기 : 네이버 블로그 (naver.com)

[JQUERY] Val()함수 Value값 가져오기,설정하기

 

[Jqeury] value 값으로 요소 찾기 (tistory.com)

[Jqeury] value 값으로 요소 찾기