[8] JavaScript & JQuery - change(), text()

[ 환경 ]
ㄴ JQuery 1.11.1

Q. select박스를 선택시 텍스트가 나타나도록 하고싶습니다.

---

1. html 코드

<div>
	<select class="change">
		<option value="">선택안함</option>
		<option value="1">text생성</option>
		<option value="2">text삭제</option>
	</select>
	<span class="text"></span>
</div>

 

2. JQuery 코드 작성

// change() 활용
$(".change").change(function(){
	var select = $(".change").val();
	if(select == '1'){ // TEXT생성 선택일때 등장하도록
		$(".text").text('텍스트 등장'); // text 클래스에 text(텍스트등장) 내용 넣어주기
	}else{
		$(".text").text(''); // text 클래스에 텍스트 삭제
	}
})

ㄴ chage() - select박스의 선택시 이벤트 발동

ㄴ text() - 선택한 영역에 text()안에 입력한 텍스트가 노출되도록

 

 

3. 사이트(기능) 확인

See the Pen Untitled by 문정원 (@moonddev) on CodePen.

 

 

 

 

ㄴ Q. select박스를 선택시 텍스트가 나타나도록 하고싶습니다.

- 작동완료