클릭하면 커서 검색

Question

검색 상자에 "검색 ..."값이 있습니다. 사용자는 아무 것도 입력하기 전에이를 삭제해야합니다. 상자를 클릭하면 검색 텍스트가 어떻게 사라 집니까? 감사합니다.

Answer 1

검색 상자에 포커스를 넣고 이벤트 처리기를 흐리게 처리해야합니다.

var defaultText = "Enter your search term"; 
$('#searchBoxId').focus(function(){ 
    if(this.value == defaultText) 
     this.value = ''; 
}); 
$('#searchBoxId').blur(function(){ 
    if(this.value == '') 
     this.value = defaultText; 
}); 

페이지가로드 검색 창 바로 그 값으로 "검색어 입력"을 가지고 있는지 확인하는 경우 : 이것은 당신이 jQuery를에 그것을 할 수있는 방법이다.

Answer 2

당신이 자바 스크립트 (jQuery를) 사용할 수있는 경우 디폴트 값이입니다

, 여기에 함수의 :

JQUERY

<script type="text/javascript"> 
    (function($){ 
     $.fn.clearDefault = function(){ 
      return this.each(function(){ 
       var default_value = $(this).val(); 
       $(this).focus(function(){ 
        if ($(this).val() == default_value) $(this).val(""); 
       }); 
       $(this).blur(function(){ 
        if ($(this).val() == "") $(this).val(default_value); 
       }); 
      }); 
     }; 
    })(jQuery); 
    $('input.clear-default').clearDefault(); 
</script> 

HTML

<input class="clear-default" type="text" value="search..." name="search_box"> 

Answer 3

당신이 구글을 검색하는 경우 "눈에 잘 띄지 않는 JQuery 검색 상자"에는 많은 기사가 있습니다. 기본적으로 검색 : [TextBox]로 시작합니다. Javascript가 사용 중지 된 사용자에게 적합합니다. 그런 다음 JQuery (또는 같은)를 사용하여 "검색"DOM 요소를 숨기고 해당 텍스트를 "텍스트 상자"안에 넣은 다음 필요한 경우 기본 텍스트의 제거/추가를 처리하는 onfocus 및 blur 이벤트에 jquery 메서드를 연결합니다. .