Chrome에서 포커스에 있는 자리표시자 텍스트를 어떻게 제거할 수 있나요?

CSS 또는 jQuery를 사용하여 포커스에 있는 자리 표시자 텍스트 제거

텍스트 필드에 텍스트를 입력하면 일반적으로 자리 표시자 텍스트가 사라집니다. 사용자의 입력. 대부분의 브라우저는 이 작업을 자동으로 수행하지만 Chrome은 그렇지 않습니다.

CSS 솔루션

Chrome을 구체적으로 타겟팅하려면 input:focus::placeholder 선택기를 사용할 수 있습니다.

input:focus::placeholder {
  color: transparent;
}

이 CSS 규칙은 입력 필드에 포커스가 있을 때 자리 표시자 텍스트를 투명하게 설정합니다.

jQuery Solution

이를 달성할 수도 있습니다. jQuery:

$("input").on("focus", function() {
  $(this).attr("placeholder", "");
});

$("input").on("blur", function() {
  $(this).attr("placeholder", "Type something here!");
});

이 jQuery 코드는 입력 필드에 포커스가 있을 때 자리 표시자 텍스트를 빈 문자열로 설정하고 필드가 포커스를 잃으면 원하는 텍스트로 복원합니다.

브라우저 지원

업데이트:

이제 모든 최신 브라우저는 input:focus::placeholder CSS 선택기를 사용하여 포커스에 자리 표시자 텍스트 숨기기를 지원합니다. 따라서 jQuery 솔루션은 더 이상 필요하지 않습니다.

위 내용은 Chrome에서 포커스에 있는 자리표시자 텍스트를 어떻게 제거할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!