`
heikediguo
  • 浏览: 27441 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

IE下javascript获取textarea光标的开始结束位置

 
阅读更多

项目开发中需要计算textarea光标的开始位置与结束位置,以便于在指定位置插入文本。下面这段代码测试通过,能够得到光标的开始位置与结束位置。var er = document.selection.createRange(),start = 0,end = 0;

					if(er.parentElement().id === this.id){
						// create a selection of the whole textarea
						var er1 = document.body.createTextRange();
						er1.moveToElementText(this);
						//两个range,一个是已经选择的text(er),一个是整个textarea(er1)
						//er1.compareEndPoints()比较两个端点,如果er1比er更往左(further to the left),则 //返回小于0的值,则er1往右移一点,直到两个er的start相同。
						// calculate selection start point by moving beginning of er1 to beginning of er
						for (start = 0;er1.compareEndPoints('StartToStart',er) < 0;start++){
							er1.moveStart('character', 1);
						}
						// get number of line breaks from textarea start to selection start and add them to start
						// 计算一下\n
						for (var i = 0; i <= start;i++){
							if (this.value.charAt(i) == '\n'){
								start++;
							}
						}
						// create a selection of the whole textarea
						var er1 = document.body.createTextRange();
						er1.moveToElementText(this);
						// calculate selection end point by moving beginning of er1 to end of er
						for (end = 0;er1.compareEndPoints('StartToEnd',er) < 0;end++){
							er1.moveStart('character',1);
						}
						// get number of line breaks from textarea start to selection end and add them to end
						for (var i = 0;i <= end;i++){
							if (this.value.charAt(i) == '\n'){
								end ++;
							}
						}
					}
 
分享到:
评论

相关推荐

    JavaScript获取,设置光标位置,兼容InputTextArea

    在JavaScript编程中,获取和设置光标位置是常见的需求,特别是在与用户交互的表单元素如`&lt;input&gt;`和`&lt;textarea&gt;`中。这涉及到DOM(文档对象模型)操作和事件处理,对于创建动态和响应式的网页应用至关重要。本文将...

    在textarea光标处插入文本

    ### 在Textarea光标处插入文本 #### 知识点概览 本文将详细介绍如何使用JavaScript在`textarea`的光标位置插入文本。该方法适用于多种浏览器环境,包括Internet Explorer(IE)和其他基于Mozilla的浏览器(如Fire...

    javascript获得光标所在的文本框(text textarea)中的位置.docx

    ### JavaScript 获取光标所在文本框(text/textarea)中的位置 在前端开发中,经常需要处理用户在文本框(如`&lt;input type="text"&gt;`或`&lt;textarea&gt;`)内的输入行为,例如实现自动填充、实时校验等功能时,获取光标的...

    JS获取文本框焦点光标位置、选中起始位置、终止位置、选择内容

    对于IE8及以下版本,它利用`document.selection`和`TextRange`对象来获取光标位置。 **获取选中起始位置和终止位置**: ```javascript function getSelectionRange(input) { if (input.selectionStart !== ...

    javascript获得光标所在的文本框(text/textarea)中的位置

    在JavaScript中,获取光标在文本框(text)或文本区域(textarea)中的位置是一项常见的需求,这在处理用户输入时非常有用。标题和描述提到的`js 光标 文本框`,就是指通过JavaScript实现对文本输入光标的定位和获取...

    使用JS在textarea在光标处插入内容

    在IT领域,特别是前端开发中,使用JavaScript在`textarea`元素的光标位置插入内容是一项常见且实用的技术。本文将详细解析如何实现这一功能,并深入理解其背后的逻辑与原理。 ### 核心知识点:在`textarea`光标处...

    使用TextRange获取输入框中光标的位置的代码

    下面是一个使用JavaScript获取输入框中光标的位置的代码: ```javascript function GetCursorPsn(txb) { var slct = document.selection; var rng = slct.createRange(); txb.select(); rng.setEndPoint(...

    jQuery往textarea中光标所在位置插入文本的方法

    4. 插入文本:在textarea中插入文本涉及到的JavaScript操作包括获取当前光标位置、在光标位置插入字符串、恢复光标焦点等。本文通过判断浏览器类型和版本,使用不同的方法获取和设置光标位置。 5. 文本操作:在...

    JS获取文本框光标位置、选中起始位置、终止位置、选择内容

    在JavaScript中,可以通过`element.selectionStart`属性来获取当前光标所在的位置。这个属性返回的是一个整数,表示用户在文本框中光标所在的字符索引。例如: ```javascript const input = document....

    获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍

    本文将介绍如何在IE、Firefox和Chrome中获取div编辑框、textarea和input text光标位置的方法,并提供相应的代码示例。 首先,了解不同浏览器对于光标位置获取的支持情况是必要的。例如,IE浏览器使用了document....

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

    在本文中,我们将探讨如何在 textarea 元素中实现光标定位,同时确保兼容 Internet Explorer(IE)和 Firefox(FF)这两种主要的浏览器。 在 textarea 中设置光标位置是一个常见的需求,特别是在用户交互场景中,如...

    获取和设置输入框光标位置的插件

    "获取和设置输入框光标位置的插件"就是这样一个工具,它允许开发者方便地获取或设定文本输入框中的光标位置,从而提升应用的功能性和用户友好性。 首先,我们需要理解光标在输入框中的作用。光标是用户输入时的指示...

    js 获取光标在文本框中的位置

    在JavaScript中,获取光标在文本框(input[type="text"]或textarea)中的位置是一项常见的需求,这在处理用户输入或者实现某些特定功能时非常有用。以下是一些关于如何使用JavaScript来实现这一功能的关键知识点: ...

    JS在TextArea光标位置插入文字并实现移动光标到文字末尾

    在JavaScript中,操作文本输入域,如`&lt;textarea&gt;`,涉及到光标位置的处理时,通常需要使用到浏览器提供的API。对于不同的浏览器,这些API可能会有所差异。在处理`&lt;textarea&gt;`光标位置插入文字并移动光标到文字末尾的...

    JavaScript 获取/设置光标位置,兼容InputTextArea

    在JavaScript中,获取和设置光标位置是常见的需求,特别是在处理用户输入时,例如在`Input`或`TextArea`元素中。以下将详细介绍如何在不同类型的输入元素中实现这一功能,并确保兼容性。 首先,我们需要了解`Input`...

    JS在textarea光标处插入文本的小例子

    标题“JS在textarea光标处插入文本的小例子”和描述“本实例使用Javascript实现在textarea光标处插入文本,支持多种浏览器”揭示了该文档是关于如何使用JavaScript在网页文本区域(textarea)组件光标所在位置插入...

    JavaScript 获取/设置光标位置,兼容Input&amp;&amp;TextArea

    本文将深入探讨如何用JavaScript获取和设置Input和TextArea元素中的光标位置,并提供兼容性处理的方法。 在获取Input或TextArea元素光标位置时,我们需要区分对待IE浏览器和其他现代浏览器。IE浏览器通过document....

    javascript获取以及设置光标位置

    在IE浏览器中,通过document.selection.createRange()获取当前选区的范围,然后通过moveStart移动起始位置到文本输入框的开始,再通过length属性获取当前选区的长度,这个长度实际上就是光标的位置。对于Firefox等...

    JavaScript记录光标在编辑器中位置的实现方法_.docx

    然而,对于不支持这些属性的老版IE浏览器,我们需要使用`document.selection`对象和`createRange()`方法来获取光标位置。以下是一个兼容IE的实现: ```javascript if (typeof(textBox.selectionStart) == "number")...

Global site tag (gtag.js) - Google Analytics