>  기사  >  웹 프론트엔드  >  javascript textarea 커서 위치 지정 방법(IE 및 FF와 호환)_javascript 기술

javascript textarea 커서 위치 지정 방법(IE 및 FF와 호환)_javascript 기술

WBOY
WBOY원래의
2016-05-16 18:09:441068검색

오늘 저는 Sina Weibo의 기능과 마찬가지로 블로그 전달 기능을 작업하고 있습니다. 여기에는 우리 블로그를 게시하는 상자가 있습니다. 이 전달 버튼을 클릭하면 그의 빈약한 블로그가 나타납니다. amount는 textArea에 들어갈 것입니다. 아주 간단한 텍스트 상자 할당인 것 같습니다. 실제로 이때 커서가 앞쪽에 위치한다는 것이 어렵습니다.

그래서 바이두와 구글을 뒤져보니 아래의 방법이
IE

코드복사 코드는

var tea=document.getElementById("텍스트 상자의 ID")
var txt=textArea.createTextRange()
txt.moveEnd("character" ,0- tempText.text.length);
txt.select();

근데 이 방법은 IE 브라우저에서만 가능해서 인터넷 검색으로 블로그를 찾았어요
오랫동안 검색해서 다양한 방법을 시도해 보았지만 대부분은 IE 또는 IE만 지원하지 않았습니다. 마지막으로 마스터는 이전 페이지에 이 기능이 있다고 말했고 IE와 모두에서 작동했습니다. FF!
코드 공유
코드 복사 코드는 다음과 같습니다.

function locatedPoint (){
var aCtrl = document.getElementById("txtContent");
if (aCtrl.setSelectionRange) {
setTimeout(function() {
aCtrl.setSelectionRange(0, 0); / / 커서를 텍스트 영역 시작 부분에 배치합니다. 다른 위치에 배치해야 하는 경우 직접 수정하세요.
aCtrl.focus()
},
}else if (aCtrl; .createTextRange) {
var textArea=document .getElementById("txtContent");
var tempText=textArea.createTextRange()
tempText.moveEnd("character",0-tempText.text.length) ;
tempText.select();
}
}

FF
코드 복사 코드는 다음과 같습니다.

var tea=document.getElementById("텍스트 상자의 ID")
tea.setSelectionRange(0, 0 ); // 커서를 텍스트 영역의 시작 부분에 놓고 찾아야 합니다. 다른 위치에 대해서는 직접 수정하십시오.
tea.focus()

호환되는 방법을 위해 if를 사용하여 판단을 추가할 수 있습니다. 통합 방법은 해당 게시물과 같습니다
html 부분
코드 복사 코드는 다음과 같습니다.




JS 부분
코드 복사 코드는 다음과 같습니다:

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.