Firefox 및 IE에서는 작동하지만 Chrome 및 Safari에서는 실패 (오류 없음, 작동하지 않음) 하는 다음 jQuery 코드 ( 이 질문 과 유사 함 )가 있습니다. 해결 방법에 대한 아이디어가 있습니까?
$("#souper_fancy").focus(function() { $(this).select() });
답변
선택이 선택 취소되는 원인은 onmouseup 이벤트이므로 다음을 추가하기 만하면됩니다.
$("#souper_fancy").mouseup(function(e){
e.preventDefault();
});
답변
$('#randomfield').focus(function(event) {
setTimeout(function() {$('#randomfield').select();}, 0);
});
답변
이것은 input type = “text”요소에 대해 잘 작동합니다. #souper_fancy는 어떤 요소입니까?
$("#souper_fancy").focus(function() {
$(this).select();
});
답변
mouseup에서 기본값을 방지하기 만하면 텍스트 선택이 항상 켜져 있습니다. MOUSEUP 이벤트는 텍스트 선택을 지우는 역할을합니다. 그러나 기본 동작을 방지하여 마우스를 사용하여 텍스트 선택을 취소 할 수 없습니다.
이를 방지하고 텍스트 선택이 다시 작동하도록하려면 FOCUS에 플래그를 설정하고 MOUSEUP에서 읽고 재설정하여 향후 MOUSEUP 이벤트가 예상대로 작동하도록 할 수 있습니다.
$("#souper_fancy").focus(function() {
$(this).select();
//set flag for preventing MOUSEUP event....
$this.data("preventMouseUp", true);
});
$("#souper_fancy").mouseup(function(e) {
var preventEvent = $this.data("preventMouseUp");
//only prevent default if the flag is TRUE
if (preventEvent) {
e.preventDefault();
}
//reset flag so MOUSEUP event deselect the text
$this.data("preventMouseUp", false);
});
답변
이것은 IE, Firefox, Chrome, Safari 및 Opera에서 선택하는 데 작동하지만 Firefox, Chrome 및 Safari에서 두 번 클릭하여 편집 할 수는 없습니다. 완전히 확실하지는 않지만 필드에 이미 포커스가 있어도 커서를 실제로 삽입 할 수없는 경우에도 3 개의 브라우저가 포커스 이벤트를 다시 발행했기 때문일 수 있습니다 (다시 선택하기 때문에). Opera는 그렇게하지 않는 것처럼 보이므로 포커스 이벤트가 다시 발생하지 않아 커서가 삽입됩니다.
답변
이것은 크롬에서도 작동합니다.
$("#souper_fancy").focus(function() {
var tempSouper = $(this);
setTimeout(function(){
tempSouper.select();
},100);
});
답변
setTimeout을 사용할 때 깜박임이 있기 때문에 다른 이벤트 기반 솔루션이 있습니다. 이렇게하면 ‘focus’이벤트가 ‘mouseup’이벤트를 연결하고 이벤트 핸들러가 다시 분리됩니다.
function selectAllOnFocus(e) {
if (e.type == "mouseup") { // Prevent default and detach the handler
console.debug("Mouse is up. Preventing default.");
e.preventDefault();
$(e.target).off('mouseup', selectAllOnFocus);
return;
}
$(e.target).select();
console.debug("Selecting all text");
$(e.target).on('mouseup', selectAllOnFocus);
}
그런 다음 첫 번째 이벤트를 연결
$('.varquantity').on('focus', selectAllOnFocus);