[jQuery] 제이쿼리로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 1

jQuery로 작성된 자바스크립트 부분을 빼면 다음과 같이 화면에 보여집니다.

'사이트 검색'이라는 부분을 inputbox에 넣어보는 예제입니다.

  $(document).ready(function() {
      var searchLabel = $("#search label").remove().text();
      $("#searchText").addClass("placeholder").val(searchLabel);
  });

$(document).ready(function() {...} 에 코딩을 하면 화면이 로딩되자마자 실행이 됩니다.
var searchLabel = $("#search label").remove().text(); => label에 있는 텍스트인 '사이트 검색'이라는 값을 searchLabel이라는 변수에 저장하고 지웁니다.
$("#searchText").addClass("placeholder").val(searchLabel); => searchLabel에 저장된 값을 inputbox(#searchText)에 value값으로 넣습니다.

자, 이렇게 간단한 코딩만으로 '사이트 검색'이라는 제목을 inputbox에 넣는 걸 구현했습니다.

다음 예제들도 확인해 보세요.

2014/12/05 - [프로그래밍 언어/jQuery] - jQuery로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 2
2014/12/05 - [프로그래밍 언어/jQuery] - jQuery로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 3