JavaScript를 사용하여 자리 표시 자 텍스트를 가짜로 만들 수 있습니까?

Question

사용자가 입력 필드에 우편 번호를 입력하고 Enter 키를 누르거나 제출 버튼을 클릭하여 데이터베이스에 우편 번호를 제출하면 검색 결과가 페이지에 반환됩니다. Enter 키를 사용하면 모든 것이 잘 작동합니다. 사용자가 제출 단추를 클릭 할 때 상황이 잘 작동하지 않습니다 ...

이유는 우편 번호 필드의 기본 텍스트가 "우편 번호"이기 때문입니다. 요소에 포커스가있을 때 jQuery를 사용하여 val()을 ''로 설정합니다. 포커스가 필드를 떠날 때

$('div.program-locator input#zipcode').focus(function() { 
    $(this).val(''); 
}); 

, 나는 다시 "우편 번호"로 필드를 설정하기 위해 .blur 이벤트를 사용합니다.

$('div.program-locator input#zipcode').blur(function() { 
    $(this).val('Zip Code'); 
}); 

문제는 우편 번호 필드에 "우편 번호"의 값을 설정, 사용자가 제출 버튼을 클릭하면, .blur 이벤트가 호출된다는 사실에있다. 왝.

어떻게이 문제를 해결할 수 있습니까? submit.click 이벤트를 호출 할 때까지 # zipcode.blur 이벤트를 호출하지 않는 방법이 있습니까?

Answer 1

흐림 기능 내부에 조건부를 추가하십시오.

if($(this).val()==""){ 
    $(this).val("Zip Code"); 
} 

Answer 2

나는 당신의 간단한 해결책은 말할 것입니다 :

$('div.program-locator input#zipcode').blur(function() { 
    setTimeout(function() { $('#zipcode').val('Zip Code'); }, 10); 
}); 

리셋에 약간의 지연이 추가 기능이 해고 할 수 제출할 수 있도록. 시간은 중요하지 않습니다. 제출 처리기가 완료된 후에 실행할 함수를 대기하는 한 오래입니다.