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 核心参考教程 内置对象
Oct 13 Javascript
javascript重复绑定事件造成的后果说明
Mar 02 Javascript
JS获取各种浏览器窗口大小的方法
Jan 14 Javascript
JS(JQuery)操作Array的相关方法介绍
Feb 11 Javascript
javascript中HTMLDOM操作详解
Dec 11 Javascript
jQuery性能优化技巧分析
Feb 20 Javascript
jQuery实现Tab选项卡切换效果简单演示
Nov 23 Javascript
浅析AngularJS Filter用法
Dec 28 Javascript
vue2.0全局组件之pdf详解
Jun 26 Javascript
基于vue打包后字体和图片资源失效问题的解决方法
Mar 06 Javascript
用Cordova打包Vue项目的方法步骤
Feb 02 Javascript
新手入门带你学习JavaScript引擎运行原理
Jun 24 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
PHP中在数据库中保存Checkbox数据(2)
2006/10/09 PHP
PHP mkdir()定义和用法
2009/01/14 PHP
PHP实现多条件查询实例代码
2010/07/17 PHP
基于php下载文件的详解
2013/06/02 PHP
php获取301跳转URL简单实例
2013/12/16 PHP
php实现zip文件解压操作
2015/11/03 PHP
详解WordPress中给链接添加查询字符串的方法
2015/12/18 PHP
Mootools 1.2教程 排序类和方法简介
2009/09/15 Javascript
JavaScript调用Activex控件的事件的实现方法
2010/04/11 Javascript
jQuery中通过ajax调用webservice传递数组参数的问题实例详解
2016/05/20 Javascript
JQuery实现列表中复选框全选反选功能封装(推荐)
2016/11/24 Javascript
获取jqGrid中选择的行的数据
2016/11/30 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
2017/01/23 Javascript
js指定步长实现单方向匀速运动
2017/07/17 Javascript
vue中keep-alive的用法及问题描述
2018/05/15 Javascript
vue+egg+jwt实现登录验证的示例代码
2019/05/18 Javascript
微信小程序 如何保持登录状态
2019/08/16 Javascript
[49:11]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第二场 12.20
2020/12/23 DOTA
Python下singleton模式的实现方法
2014/07/16 Python
Python中使用ConfigParser解析ini配置文件实例
2014/08/30 Python
python对json的相关操作实例详解
2017/01/04 Python
解决pycharm安装后代码区不能编辑的问题
2018/10/28 Python
pytorch多进程加速及代码优化方法
2019/08/19 Python
linux下python中文乱码解决方案详解
2019/08/28 Python
python_matplotlib改变横坐标和纵坐标上的刻度(ticks)方式
2020/05/16 Python
利用python中的matplotlib打印混淆矩阵实例
2020/06/16 Python
django haystack实现全文检索的示例代码
2020/06/24 Python
用React加CSS3实现微信拆红包动画效果
2017/03/13 HTML / CSS
手工制作的豪华英式沙发和沙发床:Willow & Hall
2019/05/03 全球购物
中东奢侈品市场:Coveti
2019/05/12 全球购物
网络工程专业毕业生推荐信
2013/10/28 职场文书
简历中自我评价怎么写
2014/02/12 职场文书
环保建议书作文400字
2015/09/14 职场文书
2016五一手机促销广告语
2016/01/28 职场文书
分享15个Webpack实用的插件!!!
2021/03/31 Javascript
Appium中scroll和drag_and_drop根据元素位置滑动
2022/02/15 Python