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 相关文章推荐
Jquery作者John Resig自己封装的javascript 常用函数
Nov 09 Javascript
Jquery中getJSON在asp.net中的使用说明
Mar 10 Javascript
标题过长使用javascript按字节截取字符串
Apr 24 Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
Mar 03 Javascript
浅谈jQuery的offset()方法及示例分享
Jul 17 Javascript
微信小程序(应用号)简单实例应用及实例详解
Sep 26 Javascript
微信运维交互机器人的示例代码
Nov 12 Javascript
详解jenkins自动化部署vue
May 14 Javascript
vue-cli设置publicPath小记
Apr 14 Javascript
微信小程序实现电子签名功能
Jul 29 Javascript
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
Aug 10 Javascript
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
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 array_multisort()函数的使用札记
2011/07/03 PHP
深入eAccelerator与memcached的区别详解
2013/06/06 PHP
PHP的拦截器实例分析
2014/11/03 PHP
ThinkPHP采用原生query实现关联查询left join实例
2014/12/02 PHP
PHP应用跨时区功能的实现方法
2019/03/21 PHP
Javascript 按位左移运算符使用介绍(
2014/02/04 Javascript
JavaScript脚本判断蜘蛛来源的方法
2015/09/22 Javascript
jQuery手动点击实现图片轮播特效
2020/04/20 Javascript
JS和jQuery使用submit方法无法提交表单的原因分析及解决办法
2016/05/17 Javascript
微信小程序开发的四十个技术窍门总结(推荐)
2017/01/23 Javascript
JS简单实现数组去重的方法示例
2017/03/27 Javascript
使用JavaScript实现在页面中显示距离2017年中秋节的天数
2017/09/26 Javascript
Vue 中使用vue2-highcharts实现曲线数据展示的方法
2018/03/05 Javascript
详解微信图片防盗链“此图片来自微信公众平台 未经允许不得引用”的解决方案
2019/04/04 Javascript
jquery实现垂直手风琴导航栏
2020/02/18 jQuery
[42:04]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第一局
2016/03/03 DOTA
python 字典修改键(key)的几种方法
2018/08/10 Python
基于Python实现定时自动给微信好友发送天气预报
2018/10/25 Python
用Python将结果保存为xlsx的方法
2019/01/28 Python
python实现从wind导入数据
2019/12/03 Python
Python实现非正太分布的异常值检测方式
2019/12/09 Python
pytorch 实现在预训练模型的 input上增减通道
2020/01/06 Python
Python进程Multiprocessing模块原理解析
2020/02/28 Python
150行Python代码实现带界面的数独游戏
2020/04/04 Python
python + selenium 刷B站播放量的实例代码
2020/06/12 Python
Python多分支if语句的使用
2020/09/03 Python
python 实现aes256加密
2020/11/27 Python
IE兼容css3圆角的实现代码
2011/07/21 HTML / CSS
美国市场上最实惠的送餐服务:Dinnerly
2018/03/18 全球购物
Java中有几种方法可以实现一个线程?用什么关键字修饰同步方法?stop()和suspend()方法为何不推荐使用?
2015/08/04 面试题
班子查摆四风个人对照检查材料思想汇报
2014/10/04 职场文书
公务员政审材料
2014/12/23 职场文书
户外活动总结
2015/02/04 职场文书
结婚通知短信大全
2015/04/17 职场文书
大学生见习总结报告
2015/06/24 职场文书
MySQL事务的ACID特性以及并发问题方案
2022/07/15 MySQL