`
zhujinguo
  • 浏览: 129703 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

光标在input中的定位

IE 
阅读更多
IE下的Range操作比Mozilla下强很多,这里只讨论IE下的操作。
这里选介绍几个光标定位的特点:
1.光标不变
直接obj.focus(),光标会返回之前的位置,即位置不变
2.光标在最前
var r = obj.createTextRange();
r.collapse();
r.select();
用这个方法可以使光标在input框最前面
3.光标在最后 var r = obj.createTextRange();
r.collapse(false);
r.select();
用这个方法可以使光标停在input框的最后
4.选取input框中部分内容需要用到Range的moveStart或moveEnd方法, 其详细的方法使用可以参考MSDN.
<script type="text/javascript">
function sl(o, m, n){
var rt = o.createTextRange();
rt.collapse();
rt.select();//光标置最前
var r = document.selection.createRange();
r.collapse(false);
r.moveStart("character", m);//从m位开始
r.moveEnd("character", n);//选取n位
r.select();
}
</script>
<input name="a" value="123456789"><input type=button value="select" onclick="sl(a,2,4)">

5.再引申一下光标的移动和位置,这个是有人经常问到的问题 <input name=a value="123456789">
<input type=button value="向前" onclick="setpos(a,-1)">
<input type=button value="向后" onclick="setpos(a,1)">
<input type=button value="当前光标的位置" onclick="getpos(a)">
<script type="text/javascript">
function setpos(obj,n)
{
obj.focus();
var r = document.selection.createRange();
r.collapse(false);
r.move("character", n);
r.select();
};
function getpos(obj)
{
obj.focus();//光标位置不变
var r = document.selection.createRange();
r.collapse(false);
r.setEndPoint("StartToStart", obj.createTextRange());
alert(r.text.length);
};
</script>
分享到:
评论

相关推荐

    input光标操作.html|input光标操作.html

    当opsStart和opsEnd相同时,可用于定位光标位置。 setSelectionRange实际上是改变了selectionStart 和 selectionEnd属性,所以也可以通过直接修改这两个属性来实现 方法二 input.selectionStart = opsStart; input...

    输入密码时显示密码及光标定位到末尾

    输入密码时显示密码及光标定位到末尾.用JS实现的,自己看看吧

    iOS11.3以下modal中input光标错位的解决方法

    主要介绍了iOS11.3以下modal中input光标错位的解决方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    将光标定位于输入框最右侧实现代码

    前端开发过程中,经常需要这样的场景。用JS实现将光标定位于输入框最右侧。 场景一:编辑图片的描述文字 场景二:Script.aculo.us的Ajax.InPlaceEditor类。双击可编辑,编辑后离开可自动更新该区域。 以上场景都需要...

    光标的一些操作总结

    IE下的Range操作比Mozilla下强很... 用这个方法可以使光标在input框最前面 3.光标在最后 代码如下:var r = obj.createTextRange(); r.collapse(false); r.select(); 用这个方法可以使光标停在input框的最后 4.选取inpu

    光标定位等TextRange的操作的范例代码

    INPUT{border: 1 solid #000000} BODY,TABLE{font-size: 10pt} 点击 TextArea 实现光标定位 我怕来不及我要抱着你,直到感觉你的绉纹有了岁月的痕迹,直到视线变得模糊直到不能呼吸 为了你我愿意 动也不能动...

    将光标定位到textarea的某一行的javascript代码

    &lt;textarea name=”ta1″ rows=5 cols=50&...input value=”1″ name=”line”&gt; &lt;input type=button onclick=”goL(parseInt(line.value));” value=”go”&gt; [removed] function goL(Line) { 

    js光标定位文本框回车表单提交问题的解决方法

    当光标定位在辅助查找的文本框后回车,页面会出现方法的返回的json串。 原因:When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to...

    javascript textarea光标定位方法(兼容IE和FF)

    主要是实现textarea中光标的定位方法,考虑到多浏览器的兼容性,需要的朋友可以参考下。

    Firefox2中输入框丢失光标bug的解决方法

    在Firefox2中某些情况下输入框虽然可以输入,但在获取焦点时没有文本输入光标的显示,这个是非常恶心的bug,非常容易让表单使用者有一种不能输入的错觉,即使后来尝试知道可以输入,但也无法判断光标定位在哪儿。

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

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

    vue-input-keyboard:带验证器的输入键盘,用于

    vue-input-keyboard 以数字为主的键盘模拟组件,且内置有效性验证,优化输入互动逻辑,提高用户的输入效率。 基础特性: 支持输入常规的数字值,支持负数,支持小数。 支持触控屏操作 支持 清除、删除和确认操作。...

    一个简易行文本编辑器的实现

    行文本编辑器(基本功能要求) 实现一个英文字符的行文本编辑器,该编辑器根据用户输入的命令可以完成以下功能—— ...(注:如需使用光标定位,可以直接用一个字符符号表示光标。) 进一步: 完善文本形式界面的设计,

    完全免费的Java/jsp开发编辑工具FirstJava2

    8.输入"while("时,代码编辑区将会自动输入"while(){}",插入一个空行,光标定位于括号中; 9.输入"switch("时,代码编辑区将会自动输入"switch(){case 0: break; default: }",插入相应的空行和自动缩进, 光标定位于括号...

    FirstJava2完全教材

    8.输入"while("时,代码编辑区将会自动输入"while(){}",插入一个空行,光标定位于括号中; 9.输入"switch("时,代码编辑区将会自动输入"switch(){case 0: break; default: }",插入相应的空行和自动缩进, 光标定位于括号...

    latex-tree:LaTeX的文档树视图

    单击树状视图中的项目将光标(并滚动文本编辑器)定位到LaTeX文件中的相应位置。 单击树状视图后,文本编辑器将聚焦,因此您可以移动光标或立即开始键入(可以在设置中关闭)。 树状视图中的相应项目将根据当前...

    vue实现输入框自动跳转功能

    主要为大家详细介绍了vue实现输入框自动跳转功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    js移动焦点到最后位置的简单方法

    当输入框(input/textarea)获得焦点时,将焦点移动到最后,在某些情况下用户体验很好。网上的大部分方法都是针对IE浏览器的。 代码如下: var el = document.getElementById('txtArticle'); var range = el....

    myeclipse快捷建

    此时要将输入法中Chinese(Simplified)IME-Ime/Nonlme Toggle的快捷键(用于切换英文和其他文字)改成其他的如改成Ctrl+Shift+Z,同时在“Text Service and Input Languages”对话框中删掉Chinese(PRC)下面的其他中文...

    zinput:带放大、选择、全部缩小的 Ginput-matlab开发

    可以使用鼠标定位光标。 鼠标右键输入数据点(OUT_REGS(1)==OUT_REGS(2)==point_X),中键选择当前轴的区域,左键放大,单击放大,单击并拖动缩放到选定区域(双击应缩小 - 此功能待定)。 键盘上除回车外的任何键...

Global site tag (gtag.js) - Google Analytics