javascript获取以及设置光标位置


Posted in Javascript onFebruary 16, 2017

一. 获取光标位置:

// 获取光标位置
function getCursortPosition (textDom) {
 var cursorPos = 0;
 if (document.selection) {
  // IE Support
  textDom.focus ();
  var selectRange = document.selection.createRange();
  selectRange.moveStart ('character', -textDom.value.length);
  cursorPos = selectRange.text.length;
 }else if (textDom.selectionStart || textDom.selectionStart == '0') {
  // Firefox support
  cursorPos = textDom.selectionStart;
 }
 return cursorPos;
}

二. 设置光标位置:

// 设置光标位置
function setCaretPosition(textDom, pos){
 if(textDom.setSelectionRange) {
  // IE Support
  textDom.focus();
  textDom.setSelectionRange(pos, pos);
 }else if (textDom.createTextRange) {
  // Firefox support
  var range = textDom.createTextRange();
  range.collapse(true);
  range.moveEnd('character', pos);
  range.moveStart('character', pos);
  range.select();
 }
}

三. 获取选中文字:

// 获取选中文字
function getSelectText() {
 var userSelection, text;
 if (window.getSelection) {
  // Firefox support
  userSelection = window.getSelection();
 } else if (document.selection) {
  // IE Support
  userSelection = document.selection.createRange();
 }
 if (!(text = userSelection.text)) {
  text = userSelection;
 }
 return text;
}

四. 选中特定范围的文本:

/**
* 选中特定范围的文本
* 参数:
*  textDom [JavaScript DOM String] 当前对象
*  startPos [Int] 起始位置
*  endPos [Int] 终点位置
*/
function setSelectText(textDom, startPos, endPos) {
 var startPos = parseInt(startPos),
  endPos = parseInt(endPos),
  textLength = textDom.value.length;
 if(textLength){
  if(!startPos){
   startPos = 0;
  }
  if(!endPos){
   endPos = textLength;
  }
  if(startPos > textLength){
   startPos = textLength;
  }
  if(endPos > textLength){
   endPos = textLength;
  }
  if(startPos < 0){
   startPos = textLength + startPos;
  }
  if(endPos < 0){
   endPos = textLength + endPos;
  }
  if(textDom.createTextRange){
   // IE Support
   var range = textDom.createTextRange();
   range.moveStart("character",-textLength);
   range.moveEnd("character",-textLength);
   range.moveStart("character", startPos);
   range.moveEnd("character",endPos);
   range.select();
  }else{
   // Firefox support
   textDom.setSelectionRange(startPos, endPos);
   textDom.focus();
  }
 }
}

五. 在光标后插入文本:

/**
* 在光标后插入文本
* 参数:
*  textDom [JavaScript DOM String] 当前对象
*  value [String] 要插入的文本
*/
function insertAfterText(textDom, value) {
 var selectRange;
 if (document.selection) {
  // IE Support
  textDom.focus();
  selectRange = document.selection.createRange();
  selectRange.text = value;
  textDom.focus();
 }else if (textDom.selectionStart || textDom.selectionStart == '0') {
  // Firefox support
  var startPos = textDom.selectionStart;
  var endPos = textDom.selectionEnd;
  var scrollTop = textDom.scrollTop;
  textDom.value = textDom.value.substring(0, startPos) + value + textDom.value.substring(endPos, textDom.value.length);
  textDom.focus();
  textDom.selectionStart = startPos + value.length;
  textDom.selectionEnd = startPos + value.length;
  textDom.scrollTop = scrollTop;
 }
 else {
  textDom.value += value;
  textDom.focus();
 }
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
慎用 somefunction.prototype 分析
Jun 02 Javascript
ajax 同步请求和异步请求的差异分析
Jul 04 Javascript
JavaScript入门之对象与JSON详解
Oct 21 Javascript
详细分析Javascript中创建对象的四种方式
Aug 17 Javascript
基于touch.js手势库+zepto.js插件开发图片查看器(滑动、缩放、双击缩放)
Nov 17 Javascript
JavaScript仿百度图片浏览效果
Nov 23 Javascript
JS实现给json数组动态赋值的方法示例
Mar 19 Javascript
使用store来优化React组件的方法
Oct 23 Javascript
JavaScript如何使用插值实现图像渐变
Jun 28 Javascript
vue实现购物车列表
Jun 30 Javascript
浅谈JS for循环中使用break和continue的区别
Jul 21 Javascript
解决vue scoped scss 无效的问题
Sep 04 Javascript
JavaScript实现翻页功能(附效果图)
Feb 16 #Javascript
浅谈$_FILES数组为空的原因
Feb 16 #Javascript
原生js实现秒表计时器功能
Feb 16 #Javascript
js 将input框中的输入自动转化成半角大写(税号输入框)
Feb 16 #Javascript
基于JS实现翻书效果的页面切换样式
Feb 16 #Javascript
js实现3d悬浮效果
Feb 16 #Javascript
JavaScript中利用构造器函数模拟类的方法
Feb 16 #Javascript
You might like
浅谈PHP语法(1)
2006/10/09 PHP
PHP+MYSQL的文章管理系统(二)
2006/10/09 PHP
PHPCMS的使用小结
2010/09/20 PHP
基于php iconv函数的使用详解
2013/06/09 PHP
解析在zend Farmework下如何创立一个FORM表单
2013/06/28 PHP
百度工程师讲PHP函数的实现原理及性能分析(二)
2015/05/13 PHP
thinkPHP导出csv文件及用表格输出excel的方法
2015/12/30 PHP
Laravel框架实现redis集群的方法分析
2017/09/14 PHP
RR vs IO BO3 第二场2.13
2021/03/10 DOTA
JS处理VBArray的函数使用说明
2008/05/11 Javascript
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
2013/06/17 Javascript
jquery和javascript的区别(常用方法比较)
2013/07/04 Javascript
JavaScript不使用prototype和new实现继承机制
2014/12/29 Javascript
jQuery点缩略图弹出层显示大图片
2015/02/13 Javascript
jQuery实现仿路边灯箱广告图片轮播效果
2015/04/15 Javascript
JavaScript数据类型学习笔记
2016/01/25 Javascript
JS限定手机版中图片大小随分辨率自动调整的方法
2016/12/05 Javascript
JS实现的雪花飘落特效示例
2019/12/03 Javascript
vue 移动端记录页面浏览位置的方法
2020/03/11 Javascript
python字符串排序方法
2014/08/29 Python
Python实现快速排序算法及去重的快速排序的简单示例
2016/06/26 Python
python实现字符串和字典的转换
2018/09/29 Python
Python实现高斯函数的三维显示方法
2018/12/29 Python
python中字典按键或键值排序的实现代码
2019/08/27 Python
python创建学生成绩管理系统
2019/11/22 Python
TFRecord文件查看包含的所有Features代码
2020/02/17 Python
Python脚本去除文件的只读性操作
2020/03/05 Python
Python 实现一个简单的web服务器
2021/01/03 Python
html5 canvas 简单画板实现代码
2012/01/05 HTML / CSS
美国沃尔玛网上超市:Walmart
2020/08/14 全球购物
Linux中如何设置Java环境变量(Ubuntu)
2016/07/24 面试题
期中考试反思800字
2014/05/01 职场文书
会计系毕业求职信
2014/08/07 职场文书
代理人委托书
2014/09/16 职场文书
2015新学期家长寄语
2015/02/26 职场文书
2016年秋季趣味运动会开幕词
2016/03/04 职场文书