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 相关文章推荐
JS中style属性
Oct 11 Javascript
Sample script that deletes a SQL Server database
Jun 16 Javascript
javascript 常用关键字列表集合
Dec 04 Javascript
jQuery1.6 使用方法一
Nov 23 Javascript
jquery删除提示框弹出是否删除对话框
Jan 07 Javascript
js获取内联样式的方法
Jan 27 Javascript
jQuery Mobile中的button按钮组件基础使用教程
May 23 Javascript
微信小程序微信支付接入开发实例详解
Apr 12 Javascript
详解vue 项目白屏解决方案
Oct 31 Javascript
js如何验证密码强度
Mar 18 Javascript
微信小程序实现拼图小游戏
Oct 22 Javascript
Vue 实现可视化拖拽页面编辑器
Feb 01 Vue.js
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实现)只使用++运算实现加法,减法,乘法,除法
2013/06/27 PHP
Laravel模板引擎Blade中section的一些标签的区别介绍
2015/02/10 PHP
laravel执行php artisan migrate报错的解决方法
2019/10/09 PHP
javascript脚本编程解决考试分数统计问题
2008/10/18 Javascript
javascript单引号和双引号的区别和处理
2014/05/14 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
2015/02/26 Javascript
js改变embed标签src值的方法
2015/04/10 Javascript
javascript实现验证身份证号的有效性并提示
2015/04/30 Javascript
jQuery消息提示框插件Tipso
2015/05/04 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
webpack+vue.js实现组件化详解
2016/10/12 Javascript
jQuery 常见小例汇总
2016/12/14 Javascript
简单三步实现报表页面集成天气
2016/12/15 Javascript
分享一道关于闭包、bind和this的面试题
2017/02/20 Javascript
教你快速搭建Node.Js服务器的方法教程
2017/03/30 Javascript
JavaScript 完成注册页面表单校验的实例
2017/08/19 Javascript
详解Chai.js断言库API中文文档
2018/01/31 Javascript
在vue项目中,将juery设置为全局变量的方法
2018/09/25 Javascript
用Vue编写抽象组件的方法
2019/05/06 Javascript
解决vue打包后刷新页面报错:Unexpected token
2019/08/27 Javascript
python正则分组的应用
2013/11/10 Python
python爬虫之百度API调用方法
2017/06/11 Python
python实现windows下文件备份脚本
2018/05/27 Python
Python面向对象程序设计OOP入门教程【类,实例,继承,重载等】
2019/01/05 Python
用Python解决x的n次方问题
2019/02/08 Python
Python进程的通信Queue、Pipe实例分析
2020/03/30 Python
CSS3的一个简单导航栏实现
2015/08/03 HTML / CSS
多视角3D可旋转的HTML5 Logo动画
2016/03/02 HTML / CSS
英国领先的在线鱼贩:The Fish Society
2020/08/12 全球购物
党员干部廉洁承诺书
2014/05/28 职场文书
汽车专业求职信
2014/06/05 职场文书
元宵节寄语大全
2015/02/27 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
学校财务管理制度
2015/08/04 职场文书
八年级英语教学反思
2016/02/15 职场文书
python实现三次密码验证的示例
2021/04/29 Python