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算法学习(直接插入排序)
Apr 12 Javascript
重写javascript中window.confirm的行为
Oct 21 Javascript
javascript解决IE6下hover问题的方法
Jul 28 Javascript
jquery实现简单的二级导航下拉菜单效果
Sep 07 Javascript
localStorage实现便签小程序
Nov 28 Javascript
详解vue express启动数据服务
Jul 05 Javascript
简单快速的实现js计算器功能
Aug 17 Javascript
JavaScript继承的特性与实践应用深入详解
Dec 30 Javascript
微信小程序中使用echarts的实现方法
Apr 24 Javascript
让 babel webpack vue 配置文件支持智能提示的方法
Jun 22 Javascript
vue-cli history模式实现tomcat部署报404的解决方式
Sep 06 Javascript
webpack 最佳配置指北(推荐)
Jan 07 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
提问的智慧(2)
2006/10/09 PHP
用PHP和MySQL保存和输出图片
2006/10/09 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
一个刚完成的layout(拖动流畅,不受iframe影响)
2007/08/17 Javascript
基于Jquery的温度计动画效果
2010/06/18 Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
2011/03/07 Javascript
js实现局部页面打印预览原理及示例代码
2014/07/03 Javascript
初识简单却不失优雅的Vue.js
2016/09/12 Javascript
第一次接触Bootstrap框架
2016/10/24 Javascript
微信小程序 表单Form实例详解(附源码)
2016/12/22 Javascript
使用JavaScript触发过渡效果的方法
2017/01/19 Javascript
Angular 4根据组件名称动态创建出组件的方法教程
2017/11/01 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
2018/05/23 Javascript
layui数据表格 table.render 报错的解决方法
2019/09/29 Javascript
浅析Vue 中的 render 函数
2020/02/28 Javascript
jQuery实现动态操作table行
2020/11/23 jQuery
javascript中闭包closure的深入讲解
2021/03/03 Javascript
Python常用的内置序列结构(列表、元组、字典)学习笔记
2016/07/08 Python
python matplotlib坐标轴设置的方法
2017/12/05 Python
python机器学习理论与实战(五)支持向量机
2018/01/19 Python
python画出三角形外接圆和内切圆的方法
2018/01/25 Python
Python socket实现简单聊天室
2018/04/01 Python
python smtplib模块实现发送邮件带附件sendmail
2018/05/22 Python
Python决策树之基于信息增益的特征选择示例
2018/06/25 Python
如何使用python操作vmware
2019/07/27 Python
Python爬虫requests库多种用法实例
2020/05/28 Python
matplotlib事件处理基础(事件绑定、事件属性)
2021/02/03 Python
啤酒销售实习自我鉴定
2013/09/24 职场文书
幼儿园中班新学期寄语
2014/01/18 职场文书
酒店保安员岗位职责
2014/01/31 职场文书
企业业务员岗位职责
2014/03/14 职场文书
公司委托书范本
2014/04/04 职场文书
大学生党员批评与自我批评
2014/09/28 职场文书
2014年实习期工作总结
2014/11/27 职场文书
2015年乡镇统计工作总结
2015/04/22 职场文书
2016年基层党支部书记公开承诺书
2016/03/25 职场文书