Heim > Web-Frontend > js-Tutorial > Hauptteil

Zusammenfassung der Methodenbeispiele zum Festlegen des Textfeldcursors in Javascript

高洛峰
Freigeben: 2016-12-07 15:50:51
Original
1177 Leute haben es durchsucht

Das Beispiel in diesem Artikel fasst die Methode zum Festlegen des Textfeld-Cursors in JavaScript zusammen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

für Text

//得到光标位置
function getCaret(textbox) {
  var control = document.activeElement;
  textbox.focus();
  var rang = document.selection.createRange();
  rang.setEndPoint("StartToStart",textbox.createTextRange())
  control.focus();
  return rang.text.length;
}
Nach dem Login kopieren

Cursorfunktion festlegen

function getCaret(ZysrID)
{
 var txb = document.getElementById(ZysrID);//根据ID获得对象
 var pos = 0;//设置初始位置
 txb.focus();//输入框获得焦点,这句也不能少,不然后面会出错,血的教训啦.
 var s = txb.scrollTop;//获得滚动条的位置
 var r = document.selection.createRange();//创建文档选择对象
 var t = txb.createTextRange();//创建输入框文本对象
 t.collapse(true);//将光标移到头
 t.select();//显示光标,这个不能少,不然的话,光标没有移到头.当时我不知道,搞了十几分钟
 var j = document.selection.createRange();//为新的光标位置创建文档选择对象
 r.setEndPoint("StartToStart",j);//在以前的文档选择对象和新的对象之间创建对象,妈的,不好解释,我表达能力不算太好.有兴趣自己去看msdn的资料
 var str = r.text;//获得对象的文本
 var re = new RegExp("[//n]","g");//过滤掉换行符,不然你的文字会有问题,会比你的文字实际长度要长一些.搞死我了.我说我得到的数字怎么总比我的实际长度要长.
 str = str.replace(re,"");//过滤
 pos = str.length;//获得长度.也就是光标的位置
 r.collapse(false);
 r.select();//把光标恢复到以前的位置
 txb.scrollTop = s;//把滚动条恢复到以前的位置
}
Nach dem Login kopieren

function setCaret(id,pos)
{
  var textbox = document.all(id);
  var r = textbox.createTextRange();
  r.collapse(true);
  r.moveStart('character',pos);
  r.select();
}
Nach dem Login kopieren
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage