본문 바로가기
실전 코딩/javascript · jquery

placeholder 줄바꿈 스크립트(jquery)

by 정리무새 2021. 6. 23.
728x90
반응형

 

 var placeHolder = '줄바꿈을 위한 \n내용입니다.';
 var text =  $('#memo'); //ex) textarea, input...

 text.attr('value', placeHolder);
 text.focus(function() {
 	if($(this).val === placeHolder){
    	$(this).attr('value', '');
    };
 };
 
 //포커스가 나갔을때 쓰여진 텍스트가 없다면 placeHolder 문구 삽입
 text.blur(function() {
   if($(this).val === ''){
   	$(this).attr('value', 'placeHolder');
   };
 };

 

placeholder 줄바꿈을 할 내용을 변수에 저장하고 (줄바꿈은 \n로 표기 >>  \n = <br>)

attr로 그 내용을 넣어준다.

글 작성시에는 값을 리셋 시켜 공백칸으로 만들어 준다.

(if문으로 값을 비교한건 만약 글을 쓴 상태에서는 리셋시키면 안되니까)

 

jQuery Event Methods

** focus() 메서드 : 해당 컨텐츠에 마우스 클릭/엔터 키를 눌렀을 때 (말 그대로 포커스 형태)

** blur() 메서드 : 해당 컨텐츠를 벗어나 있을때 (포커스를 벗어난 형태)

focus <> blur

728x90
반응형

댓글