JS获取及设置TextArea或input文本框选择文本位置的方法

本文实例讲述了JS获取及设置TextArea或input文本框选择文本位置的方法。分享给大家供大家参考。具体实现方法如下：

function getPos(el) {
 var range, textRange, duplicate
 el.focus()
 if ( el.selectionStart ) return el.selectionStart
 else if ( document.selection ) { // IE
  range = document.selection.createRange()
  if ( range == null ) return el.value.length
  textRange = el.createTextRange()
  duplicate = textRange.duplicate()
  textRange.moveToBookmark(range.getBookmark())
  duplicate.setEndPoint('EndToStart', textRange)
  return duplicate.text.length
 }
}
function setPos(el, pos) {
 var range
 el.focus()
 if ( el.setSelectionRange )
  el.setSelectionRange(pos, pos)
 else if ( el.createTextRange ) {
  range.collapse(true)
  range.moveEnd('character', pos)
  range.moveStart('character', pos)
  range.select()
 }
}

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

赞 (0)

相关推荐

  • Input文本框随着输入内容多少自动延伸的实现

    实例如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Co

  • js实现文本框宽度自适应文本宽度的方法

    js实现文本框宽度自适应文本宽度的方法

    本文实例讲述了js实现文本框宽度自适应文本宽度的方法.分享给大家供大家参考.具体如下: 一个会随着输入文本框的字符多少而自动增加宽度的JS代码,当我们在文本框中输入字符的时候,如果文本框的宽度定义太小的话,那么我们输入的字符将会被隐藏,本段代码实现了文本框会自动适应输入文字的多少,它会自动加长. 运行效果如下图所示: 具体代码如下: <!Doctype HTML PUBLIC "-//W3c//DTD Html 1.0 Transitional//EN"> <html

  • 捕获input文本框内容改变事件的js代码

    网上一位老兄采用如此方法: readonly :是文本框不可输入. function dochg(){ document.getElementById("testId").value = "test" } setTimeout("dochg()",1000) function showValue(obj){ alert("changed value is " + obj); } [Ctrl+A 全选 注:如需引入外部Js需刷新

  • JS input文本框禁用右键和复制粘贴功能的代码

    复制代码 代码如下: function click(e) { if (document.all) { if (event.button==1||event.button==2||event.button==3) { oncontextmenu='return false'; } } if (document.layers) { if (e.which == 3) { oncontextmenu='return false'; } } } if (document.layers) { docume

  • 文本框(input)获取焦点(onfocus)时样式改变的示例代码

    摘要:许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果.其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可.本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他效果就很简单了. 许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果.其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可.本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他

  • jQuery文本框(input textare)事件绑定方法教程

    目前1.7以上,jquery​的事件绑定已经用on替换了原来的bind,接下来为大家介绍下bind的使用方法及input textare事件,感兴趣的朋友可以参考下 (1)jquery 绑定事件 目前1.7以上,jquery的事件绑定已经用on替换了原来的bind: 区别:(个人理解)bind是一次绑定事件到每一个子节点:on是只绑定到父节点,然后冒泡到各个子节点: 用法:bind 一个事件,一个方法:$(".class input").bind('click',function(e)

  • jQuery简单实现input文本框内灰色提示文本效果的方法

    本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法.分享给大家供大家参考,具体如下: $(function(){ $(".grayTips").each(function(){ //遍历每个文本框 var objTextBox=$(this); var oldText=$.trim(objTextBox.val()); objTextBox.css("color","#888"); objTextBox.focus(fun

  • input文本框样式代码实例

    通过css来更改所有的form的样式的方法,可以在css中定义input{color:red}textarea{border:1px solid #333}这样的格式,一般如果不需要更改所有的文本样式,可以通过下面的方法来定义文本框和密码框等样式 新建网页 1 用户名: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • 文本框input聚焦失焦样式实现代码

    首先用css的伪类:focus可以改变. 文本框的 html代码假设如下: 复制代码 代码如下: <dl> <dt>Name: <dt> <dd><input type="text" /></dd> <dt>Password: <dt> <dd><input type="password" /></dd> <dt>Texta

  • JS获取及设置TextArea或input文本框选择文本位置的方法

    本文实例讲述了JS获取及设置TextArea或input文本框选择文本位置的方法.分享给大家供大家参考.具体实现方法如下: function getPos(el) { var range, textRange, duplicate el.focus() if ( el.selectionStart ) return el.selectionStart else if ( document.selection ) { // IE range = document.selection.createR

  • jQuery获取及设置表单input各种类型值的方法小结

    本文实例讲述了jQuery获取及设置input各种类型值的方法.分享给大家供大家参考,具体如下: 获取一组radio被选中项的值 var item = $("input[@name=items]:checked").val(); 获取select被选中项的文本 var item = $("select[@name=items] option[@selected]").text(); select下拉框的第二个元素为当前选中值 $('#select_id')[0].s

  • js使用DOM设置单选按钮、复选框及下拉菜单的方法

    本文实例讲述了js使用DOM设置单选按钮.复选框及下拉菜单的方法.分享给大家供大家参考.具体实现方法如下: 1.设置单选按钮 单选按钮在表单中即<input type="radio" />它是一组供用户选择的对象,但每次只能选一个.每一个都有checked属性,当一项选择为ture时,其它的都变为false. 先贴上一个例子: 复制代码 代码如下: <script type="text/javascript">     function ge

  • js实现鼠标点击文本框自动选中内容的方法

    js实现鼠标点击文本框自动选中内容的方法

    本文实例讲述了js实现鼠标点击文本框自动选中内容的方法.分享给大家供大家参考.具体如下: 这里使用JS实现鼠标点击时自动选中文本框文本的效果,相信许多朋友都遇到这种功能的,就是当我们点击文本框的时候,文本框中默认的文字会被全部选中,这样当你输入的时候不用再去选择,省去了一些麻烦,提高了输入效率,用户肯定会喜欢这功能,那么实现的方法是怎么样呢?通过本代码你就搞明白了. 先来看看运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/js-mouse-click

  • JavaScript和jQuery获取input框的绝对位置实现方法

    实例如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>javascript与jQu

  • JS如何实现文本框随文本的长度而增长

    本文实例讲述了JS实现文本框随文本的长度而增长的方法,具体实现方法如下: <!Doctype HTML PUBLIC "-//W3c//DTD Html 1.0 Transitional//EN"> <html> <head> <title>文本框随文本的宽度而增长</title> </head> <script type="text/javascript"> function ch

  • js限制文本框只能输入中文的方法

    js限制文本框只能输入中文的方法

    本文实例讲述了js限制文本框只能输入中文的方法.分享给大家供大家参考.具体如下: 让文本框只能输入中文的方法及代码,如果你不小心输入了英文,它会自动倒回去,清空你的输入,直至你输入了中文它可会继续,很有意思,也很实用,当注册一些资料的时候可以来提升输入的准确度. 运行效果如下图所示: 具体代码如下: <html> <head> <title>让一个文本框只能输入汉字的方法</title> <meta http-equiv="Content-T

  • JS获取月份最后天数、最大天数与某日周数的方法

    本文实例讲述了JS获取月份最后天数.最大天数与某日周数的方法.分享给大家供大家参考,具体如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>标题页</title> <script language="javascript"> function getLastDay(year,month) { var new_year = year; /

  • C#与js实现去除textbox文本框里面重复记录的方法

    本文以实例形式展示了C#与js实现去除textbox文本框里面重复记录的方法!具体方法如下: 现有如下问题:页面有一个textbox文本框(是多行的),比如我在文本框里面输入:111,222,333,555当再输入111的时候会自动清除掉这个111,或者是在提交一个按钮前清除掉这个相同记录! 解决方案如下: 以逗号分割成一个数组 有一个Split()方法 然后比较 里面相等的就删除掉后面的那个 形成新的实例 再把新实例按格式输进来~ C#代码如下: string temp_str = "111,

  • jQuery实现限制textarea文本框输入字符数量的方法

    本文实例讲述了jQuery实现限制textarea文本框输入字符数量的方法.分享给大家供大家参考.具体实现方法如下: (function($) { $.fn.extend( { limiter: function(limit, elem) { $(this).on("keyup focus", function() { setCount(this, elem); }); function setCount(src, elem) { var chars = src.value.lengt

随机推荐