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 相关文章推荐
javascript在一段文字中的光标处插入其他文字
Aug 26 Javascript
html数组字符串拼接的最快方法
Sep 16 Javascript
javascript制作sql转换为stringBuffer的小工具
Apr 03 Javascript
AngularJS基础教程之简单介绍
Sep 27 Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
Oct 27 Javascript
原生JS实现导航下拉菜单效果
Nov 25 Javascript
js使用原型对象(prototype)需要注意的地方
Aug 28 Javascript
JS插件clipboard.js实现一键复制粘贴功能
Dec 04 Javascript
vue-cli 3.x 配置Axios(proxyTable)跨域代理方法
Sep 19 Javascript
vue ajax 拦截原理与实现方法示例
Nov 29 Javascript
Vue循环中多个input绑定指定v-model实例
Aug 31 Javascript
openlayers 3实现车辆轨迹回放
Sep 24 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
如何过滤高亮显示非法字符
2006/10/09 PHP
php excel类 phpExcel使用方法介绍
2010/08/21 PHP
php中simplexml_load_string使用实例分享
2014/02/13 PHP
Codeigniter发送邮件的方法
2015/03/19 PHP
Jquery替换已存在于element上的event的方法
2010/03/09 Javascript
javascript 得到变量类型的函数
2010/05/19 Javascript
artDialog双击会关闭对话框的修改过程分享
2013/08/05 Javascript
JavaScript基础语法、dom操作树及document对象
2014/12/02 Javascript
AngularJs Modules详解及示例代码
2016/09/01 Javascript
javascript验证香港身份证的格式或真实性
2017/02/07 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
Angular实现点击按钮控制隐藏和显示功能示例
2017/12/29 Javascript
JS实现的简单下拉框联动功能示例
2018/05/11 Javascript
浅析Vue 生命周期
2018/06/21 Javascript
[03:17]DOTA2-DPC中国联赛1月29日Recap集锦
2021/03/11 DOTA
Pyramid将models.py文件的内容分布到多个文件的方法
2013/11/27 Python
python开发之str.format()用法实例分析
2016/02/22 Python
实例讲解Python设计模式编程之工厂方法模式的使用
2016/03/02 Python
python3实现磁盘空间监控
2018/06/21 Python
python 统计一个列表当中的每一个元素出现了多少次的方法
2018/11/14 Python
pandas DataFrame的修改方法(值、列、索引)
2019/08/02 Python
python中sklearn的pipeline模块实例详解
2020/05/21 Python
matplotlib之pyplot模块之标题(title()和suptitle())
2021/02/22 Python
6种非常炫酷的CSS3按钮边框动画特效
2016/03/16 HTML / CSS
AC Lens:购买隐形眼镜
2017/02/26 全球购物
Dillard’s百货官网:Dillards.com
2018/05/26 全球购物
Nisbets法国:英国最大的厨房和餐饮设备供应商
2019/03/18 全球购物
Swanson中国官网:美国斯旺森健康产品公司
2021/03/01 全球购物
师范应届生求职信
2013/11/15 职场文书
会议主持词
2014/03/17 职场文书
校庆接待方案
2014/03/18 职场文书
社区服务标语
2014/07/01 职场文书
贫困证明书格式及范文
2014/10/15 职场文书
庆祝教师节主持词
2015/07/06 职场文书
2016年质量月活动总结报告
2016/04/05 职场文书
MySQL优化之如何写出高质量sql语句
2021/05/17 MySQL