공부/자바스크립트 jQuery
jQuery) 폼 Focus
Ohming
2012. 1. 30. 21:28
포커스는 방문객의 커서가 특정 필드 위나 안에 머물 때 발생하는 이벤트다. 이 필드에 이미 입력된 값을 제거하기 위해 사용하기도 한다.
<input name="username" type="text" id="username" value="이름을 입력해주세요">
이렇게 하면 "이름을 입력해주세요" 라는 값을 가진 텍스트 필드를 만들 수 있다. 이 기술을 사용하면 방문객이 필드에 입력해야 할 값에 대해 안내할 수 있다. 하지만 방문객이 이 폼에 값을 입력하려고 할 때 안에있는 글을 지워주기 위해서 아래와 같이 jQuery를 사용할 수 있다.
defaultValue는 페이지가 처음 읽어들여졌을 때 가지고 있던 텍스트를 의미한다. 필드의 텍스트를 지워도, 웹 브라우저는 처음의 값을 기억하기 때문에 이렇게 사용할 수 있다. 필드의 현재값(field.val() )을 처음 필드에 있던 값과 같은지 비교해서 같다면 자바스크립트는 필드에 있는 값을 지운다.
<input name="username" type="text" id="username" value="이름을 입력해주세요">
이렇게 하면 "이름을 입력해주세요" 라는 값을 가진 텍스트 필드를 만들 수 있다. 이 기술을 사용하면 방문객이 필드에 입력해야 할 값에 대해 안내할 수 있다. 하지만 방문객이 이 폼에 값을 입력하려고 할 때 안에있는 글을 지워주기 위해서 아래와 같이 jQuery를 사용할 수 있다.
defaultValue는 페이지가 처음 읽어들여졌을 때 가지고 있던 텍스트를 의미한다. 필드의 텍스트를 지워도, 웹 브라우저는 처음의 값을 기억하기 때문에 이렇게 사용할 수 있다. 필드의 현재값(field.val() )을 처음 필드에 있던 값과 같은지 비교해서 같다면 자바스크립트는 필드에 있는 값을 지운다.
$('#username').focus(function(){ var field = $(this); if(field.val() == field.attr('defaultValue')){ field.val(''); } }); |