将光标定位于输入框最右侧实现代码
更新时间：2012年12月04日 10:05:42 作者：
如何将光标定位于输入框最右侧的实现方式，这种做法很多人都需要，本文将详细介绍，需要的朋友可以参考下
前端开发过程中，经常需要这样的场景。用JS实现将光标定位于输入框最右侧。
场景一：编辑图片的描述文字
场景二：Script.aculo.us的Ajax.InPlaceEditor类。双击可编辑，编辑后离开可自动更新该区域。
以上场景都需要JS实现将光标定位于输入框最右侧，却不是通过鼠标点入输入框内。
我们知道实现最基本的方法是HTMLElement的focus方法。如下
复制代码 代码如下:
<p>
<input type="text" value="hello"/>
</p>
<script>
var input = document.getElementsByTagName('input')[0];
input.focus();
</script>
打开该页面会发现，光标位于输入框的最左侧。效果如下
而现在要实现的是将光标定位于输入框最右侧，需要三个步骤。
1，调用focus方法
2，value赋值为空
3，之前的input的值再赋给自己
复制代码 代码如下:
<p>
<input type="text" value="hello"/>
</p>
<script>
var input = document.getElementsByTagName('input')[0];
var val = input.value;
input.focus();
input.value = '';
input.value = val;
</script>
运行后效果如图，光标在深入框最右侧
相关文章
这篇文章主要介绍了深入学习JavaScript 高阶函数，在 JavaScript 中，函数是一种特殊类型的对象，它们是 Function objects。,需要的朋友可以参考下2019-06-06
这篇文章介绍了javascript的内存管理详解，有需要的朋友可以参考一下2013-08-08
这篇文章主要介绍了JavaScript中的replace()方法使用详解,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
网页javascript精华代码集...2007-01-01
本文主要介绍的是常用的Javascript数据验证插件，包括电话号码验证，邮件验证，身份证验证,需要的朋友可以参考下2015-08-08
RegExp类 RegExp对象的构造函数可以带一个或两个参数 第一个参数是描述需要进行匹配的模式字符串，如果还有第二个参数，这个参数则制定了额外的处理指令。2010-01-01
这篇文章给大家讲述了如何遵循12条方法来写出高质量的JS代码的经验，有这方便需要的朋友参考下吧。2018-01-01
本文整理了一些页面、鼠标、表单等等事件，以备开发者在项目中使用，感兴趣的朋友可以参考下哈，希望对你学习有所帮助2013-04-04
javascript 语法基础，都是一些大体的说下常见问题，适合有点别的程序基础的朋友。2009-12-12
在js中，创建对象的方式有工厂模式和构造函数模式等,但是，构造函数中的每个方法都需要在实例对象中重新创建一遍，不能复用，就需要使用原型模式来创建对象。下面我们来了解一下吧2019-05-05
最新评论