Javascript实现获取及设置光标位置的方法


Posted in Javascript onJuly 21, 2015

本文实例讲述了Javascript实现获取及设置光标位置的方法。分享给大家供大家参考。具体如下:

在项目开发中经常遇到input等设置光标位置到最后的问题,今天我查了一下Google,找到了在IE、Firefox、Opera等主流浏览器的获取光标位置(getCursortPosition)以及设置光标位置(setCursorPosition)的函数。

1. 获取光标位置函数:

function getCursortPosition (ctrl) {
  var CaretPos = 0;  // IE Support
  if (document.selection) {
  ctrl.focus ();
    var Sel = document.selection.createRange ();
    Sel.moveStart ('character', -ctrl.value.length);
    CaretPos = Sel.text.length;
  }
  // Firefox support
  else if (ctrl.selectionStart || ctrl.selectionStart == '0')
    CaretPos = ctrl.selectionStart;
  return (CaretPos);
}

2. 设置光标位置函数:

function setCaretPosition(ctrl, pos){
  if(ctrl.setSelectionRange)
  {
    ctrl.focus();
    ctrl.setSelectionRange(pos,pos);
  }
  else if (ctrl.createTextRange) {
    var range = ctrl.createTextRange();
    range.collapse(true);
    range.moveEnd('character', pos);
    range.moveStart('character', pos);
    range.select();
  }
}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript 多浏览器 事件大全
Mar 23 Javascript
Jquery截取中文字符串的实现代码
Dec 22 Javascript
JS加jquery简单实现标签元素的显示或隐藏
Sep 23 Javascript
JS判断变量是否为空判断是否null
Jul 25 Javascript
node.js中的fs.chown方法使用说明
Dec 16 Javascript
禁止按回车键提交表单的方法
Jun 11 Javascript
JavaScript获取当前运行脚本文件所在目录的方法
Feb 03 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
Dec 26 Javascript
解决angularjs前后端分离调用接口传递中文时中文乱码的问题
Aug 13 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
May 07 Javascript
js+html实现周岁年龄计算器
Jun 25 Javascript
解决vue项目获取dom元素宽高总是不准确问题
Jul 29 Javascript
详解参数传递四种形式
Jul 21 #Javascript
jquery实现Ctrl+Enter提交表单的方法
Jul 21 #Javascript
jQuery实现html元素拖拽
Jul 21 #Javascript
异步安全加载javascript文件的方法
Jul 21 #Javascript
jquery实现鼠标滑过小图查看大图的方法
Jul 20 #Javascript
详细介绍jQuery.outerWidth() 函数具体用法
Jul 20 #Javascript
SWFObject基本用法实例分析
Jul 20 #Javascript
You might like
文件系统基本操作类
2006/11/23 PHP
PHP中使用CURL伪造来路抓取页面或文件
2011/05/04 PHP
用 Composer构建自己的 PHP 框架之使用 ORM
2014/10/30 PHP
PHP写日志的实现方法
2014/11/05 PHP
PHP网络操作函数汇总
2015/05/18 PHP
php+redis消息队列实现抢购功能
2018/02/08 PHP
PHP实现单条sql执行多个数据的insert语句方法
2019/10/11 PHP
让alert不出现弹窗的两种方法
2014/05/18 Javascript
jquery队列函数用法实例
2014/12/16 Javascript
JS实现向表格中动态添加行的方法
2015/03/30 Javascript
简介JavaScript中的setTime()方法的使用
2015/06/11 Javascript
BootStrap智能表单demo示例详解
2016/06/13 Javascript
js实现页面刷新滚动条位置不变
2016/11/27 Javascript
jQuery实现在新增加的元素上添加事件方法案例分析
2017/02/09 Javascript
原生JS实现自定义滚动条效果
2020/10/27 Javascript
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
2017/07/22 jQuery
详解nodeJs文件系统(fs)与流(stream)
2018/01/24 NodeJs
vue中axios解决跨域问题和拦截器的使用方法
2018/03/07 Javascript
jQuery实现的页面详情展开收起功能示例
2018/06/11 jQuery
深入理解JS中Number(),parseInt(),parseFloat()三者比较
2018/08/24 Javascript
vue子路由跳转实现tab选项卡
2019/07/24 Javascript
JavaScript实现栈结构Stack过程详解
2020/03/07 Javascript
原生js中运算符及流程控制示例详解
2021/01/05 Javascript
[04:48]DOTA2上海特锦赛小组赛第三日 TOP10精彩集锦
2016/02/28 DOTA
[49:56]VG vs Optic 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
python3访问sina首页中文的处理方法
2014/02/24 Python
Pytorch实现的手写数字mnist识别功能完整示例
2019/12/13 Python
pytorch-RNN进行回归曲线预测方式
2020/01/14 Python
Python打印特殊符号及对应编码解析
2020/05/07 Python
Python3爬虫中Selenium的用法详解
2020/07/10 Python
python re的findall和finditer的区别详解
2020/11/15 Python
天猫国际进口超市直营:官方直采,一站购齐
2017/12/11 全球购物
英国IT硬件供应商,定制游戏PC:Mesh Computers
2019/03/28 全球购物
幼儿园中班新学期寄语
2014/01/18 职场文书
Python基础之数据类型知识汇总
2021/05/18 Python
利用Python实时获取steam特惠游戏数据
2022/06/25 Python