답변:
마우스를 사용하여 캐럿을 움직일 때마다 전체 텍스트가 선택 될 때 사용자가 성가신 것을 막으려면 focus
이벤트가 아닌 이벤트를 사용하여 수행해야합니다 click
. 다음은 작업을 수행하고 가장 간단한 버전 (예 : 이벤트 핸들러 select()
에서 텍스트 영역의 메서드를 호출하는 것 focus
)이 작동 하지 못하게하는 Chrome의 문제를 해결 합니다.
jsFiddle : http://jsfiddle.net/NM62A/
암호:
<textarea id="foo">Some text</textarea>
<script type="text/javascript">
var textBox = document.getElementById("foo");
textBox.onfocus = function() {
textBox.select();
// Work around Chrome's little problem
textBox.onmouseup = function() {
// Prevent further mouseup intervention
textBox.onmouseup = null;
return false;
};
};
</script>
jQuery 버전 :
$("#foo").focus(function() {
var $this = $(this);
$this.select();
// Work around Chrome's little problem
$this.mouseup(function() {
// Prevent further mouseup intervention
$this.unbind("mouseup");
return false;
});
});
tab
텍스트 영역으로 들어가면 실패합니다 -다른 솔루션은 두 경우 모두 작동합니다 :)
$("#foo").mouseup(function() {
$("#foo").unbind("mouseup");
return false;
});
하지 않고 텍스트 상자를 참조해야합니다 this
.
탭 및 크롬 문제에 대한 솔루션과 새로운 jquery 방법으로 더 나은 방법
$("#element").on("focus keyup", function(e){
var keycode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
if(keycode === 9 || !keycode){
// Hacemos select
var $this = $(this);
$this.select();
// Para Chrome's que da problema
$this.on("mouseup", function() {
// Unbindeamos el mouseup
$this.off("mouseup");
return false;
});
}
});
나는 이것을 사용하여 끝났다.
$('.selectAll').toggle(function() {
$(this).select();
}, function() {
$(this).unselect();
});
readonly
그런 다음 속성을 추가하여 읽기 전용으로 만들 수 있습니다 .
약간 더 짧은 jQuery 버전 :
$('your-element').focus(function(e) {
e.target.select();
jQuery(e.target).one('mouseup', function(e) {
e.preventDefault();
});
});
크롬 코너 케이스를 올바르게 처리합니다. 예는 http://jsfiddle.net/Ztyx/XMkwm/ 을 참조하십시오 .
:)
해당 게시물에 허용 된 답변을 사용하여 다음과 같이 함수를 호출 할 수 있습니다.
$(function() {
$('#textareaId').click(function() {
SelectText('#textareaId');
});
});
$(this).select()
코드가 적기 때문에 그것을 사용할 것이다 :)