신용 카드 유효성 검사에 실패했습니다. 그러나 이상한 focus()가 작동하지 않습니다.jQuery 포커스가 작동하지 않습니다.
$('#cc_number').validateCreditCard(function (result) {
if (result.length_valid && result.luhn_valid) {
} else {
$("#cc_number").focus();
return false;
}
});
<input type="text" id='cc_number' name="cc_number" />
mentioned in the comments으로 원본 jsfiddle에는 해결책이 포함되어 있습니다.
해결 방법은 포커스 호출에 시간 초과를 설정하는 것입니다.
setTimeout(function(){
$("#cc_number").focus();
}, 0);
나는 100 % 확실하지 않다, 그러나 경고가 흐림 효과라고합니다, 당신은 결코 실제로 텍스트 상자가 포커스를 잃을 수 없습니다 있다는 것을 할 수 있고, 초점이 호출 때문에 때, 이미 가지고 그것.
타임 아웃을 사용하면 로직을 별도의 스레드에 넣을 수 있습니다.이 스레드는 기본 자바 스크립트 코드와 분리되어 실행됩니다 (콜백 함수와 유사).
하지만 질문에 대한 언급도 언급했듯이 유효성 검사가 통과 될 때까지 집중해야합니다.
그러나 이것은 UX 비판에 더 가깝습니다.
이것이 작동하는 이유를 설명 할 수 있다면 전적으로 +1 할 것입니다. – Richard
@ 리차드 나는 100 % 확실하지는 않지만 현재 스레드에서 포커스가 제거 되었기 때문에 믿습니다. 작은 타임 아웃은 실제로는 무의미합니다. 타임 아웃이 콜백 함수와 같이 나머지 코드와 선형으로 작동하지 않는다는 것입니다. 그러므로 나는 혼란을 피하기 위해 답을 수정했습니다. – Curt
이벤트의 타이밍 때문입니다. Blur 이벤트 내에서 포커스를 설정하면 입력이 포커스를 얻습니다. 그러나 blur 이벤트가 완료되지 않았으므로 이벤트가 완료 될 때 초점이 손실됩니다. 타임 아웃을 추가하면 blur 이벤트가 완료된 후 .focus()가 발생할 수 있습니다. 원래 이벤트를 취소하여 동일한 효과를 낼 수도 있습니다. – Richard
DOM이 새로 고침되어 초점이 제대로 작동하지 않을 수 있습니다.
$('#cc_number').validateCreditCard(function (result) {
if (result.length_valid && result.luhn_valid) {
} else {
$("#cc_number").attr("autofocus","autofocus")
return false;
}
});
"작동하지 않는"무슨 대신 당신은이 방법을 따를 수 있는가? 입력이 흐려질 때마다 경고 메시지가 나타납니다. – j08691
크롬에서 작동합니다. –
경고 만 작동합니다 ..하지만 포커스가 실패하는 이유는 무엇입니까? ( –