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 相关文章推荐
生成二维码方法汇总
Dec 26 Javascript
Jquery动态添加输入框的方法
May 29 Javascript
jquery+CSS3实现淘宝移动网页菜单效果
Aug 31 Javascript
Spring mvc 接收json对象
Dec 10 Javascript
JS触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
Oct 30 Javascript
JavaScript严格模式详解
Jan 16 Javascript
JS中使用media实现响应式布局
Aug 04 Javascript
微信小程序保存多张图片的实现方法
Mar 05 Javascript
详解JavaScript的数据类型以及数据类型的转换
Apr 20 Javascript
微信小程序实现搜索功能并跳转搜索结果页面
May 18 Javascript
基于vue hash模式微信分享#号的解决
Sep 07 Javascript
JavaScript与JQuery框架基础入门教程
Jul 15 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
点评山进PR-D3L三波段收音机
2021/03/02 无线电
PHP 时间日期操作实战
2011/08/26 PHP
PHP面向对象精要总结
2014/11/07 PHP
Javascript 读后台cookie代码
2008/09/15 Javascript
Javascript基础教程之数据类型 (数值 Number)
2015/01/18 Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
2015/03/23 Javascript
javascript实现可全选、反选及删除表格的方法
2015/05/15 Javascript
在Ubuntu系统上安装Ghost博客平台的教程
2015/06/17 Javascript
js实现无缝滚动特效
2015/12/20 Javascript
JavaScript实现点击单元格改变背景色的方法
2016/02/12 Javascript
三种Node.js写文件的方式
2016/03/08 Javascript
微信小程序使用二次贝塞尔曲线画波浪
2018/12/25 Javascript
JSX在render函数中的应用详解
2019/09/04 Javascript
python使用自定义user-agent抓取网页的方法
2015/04/15 Python
Python使用matplotlib实现基础绘图功能示例
2018/07/03 Python
用Python编写一个简单的CS架构后门的方法
2018/11/20 Python
pandas 时间格式转换的实现
2019/07/06 Python
python写程序统计词频的方法
2019/07/29 Python
python编程进阶之异常处理用法实例分析
2020/02/21 Python
python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法
2020/02/26 Python
Python连接mysql数据库及简单增删改查操作示例代码
2020/08/03 Python
如何将Pycharm中调整字体大小的方式设置为&quot;ctrl+鼠标滚轮上下滑&quot;
2020/11/17 Python
python 下载文件的几种方法汇总
2021/01/06 Python
Html5无刷新修改browser Url的方法
2014/01/15 HTML / CSS
Canvas波浪花环的示例代码
2020/08/21 HTML / CSS
Timex手表官网:美国运动休闲手表品牌
2017/01/28 全球购物
荷兰鞋子在线:Nelson Schoenen
2017/12/25 全球购物
澳大利亚电商Catch新西兰站:Catch.co.nz
2020/05/30 全球购物
入党思想汇报
2014/01/05 职场文书
网吧七夕活动策划方案
2014/08/31 职场文书
防灾减灾标语
2014/10/07 职场文书
2015年销售员工作总结范文
2015/04/07 职场文书
2015年企业团支部工作总结
2015/05/21 职场文书
班级班风口号大全
2015/12/25 职场文书
2019通用版导游词范本!
2019/08/07 职场文书
使用 Koa + TS + ESLlint 搭建node服务器的过程详解
2022/05/30 NodeJs