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

Javascript获取光标位置以及设置光标位置

 
阅读更多

对于写javascript写网页编辑器的人来说,获取textarea中的光标位置是一个非常重要的问题,而往往很多人在这个地方不知所措,找不到好的办法.今天在此贴出Javascript获取光标位置以及设置光标位置的代码,具体见下:
获取光标位置函数:

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);
}

设置光标位置函数:

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获取,设置光标位置,兼容InputTextArea

    获取光标位置通常涉及两个属性:`selectionStart`和`selectionEnd`。这两个属性仅适用于`<input>`和`<textarea>`元素,分别表示选区的起始和结束位置。如果未选中任何文本,它们代表光标所在的位置。 ```javascript...

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

    1. **获取光标位置**:通过调用插件提供的函数,可以获取到光标在输入框内的当前位置。这通常是基于字符的索引,有助于分析用户的输入状态。 2. **设置光标位置**:插件还应提供一个方法,允许开发者指定光标的位置...

    javascript获取以及设置光标位置

    设置光标位置与获取光标位置的思路相似,使用了setCaretPosition函数。此函数同样接收文本输入框DOM元素和目标光标位置pos作为参数。如果浏览器支持setSelectionRange方法(主要在Firefox等非IE浏览器中使用),则...

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

    通过以上介绍,我们可以了解到在JavaScript中获取光标位置的基本原理和技术细节。这不仅有助于我们更好地理解用户的行为,还能为用户提供更加友好的交互体验。希望本文能帮助你在实际项目中有效地利用这些技术点。

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

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

    jQuery获取和设置文本框光标

    "jQuery获取和设置文本框光标"这个主题是关于如何利用jQuery来控制HTML输入元素(如文本框)中的光标位置以及选定文本的操作。这在创建富文本编辑器、自定义表单组件或实现某些特殊交互时非常有用。 首先,让我们...

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

    ### 获取光标位置 #### 对于`Input`元素: ```javascript function getInputCursorPos(inputElement) { var caretPos = 0; if (document.selection) { // IE inputElement.focus(); var sel = document....

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

    然而,获取光标位置需要通过`Selection`对象的`anchorNode`和`anchorOffset`属性,这些属性在没有选区时并不准确。 4. **获取光标位置的方法**: - 对于单行输入(input[type="text"]),可以使用`element....

    jquery 确定光标位置

    1. **获取光标位置**: 要获取光标在文本框中的位置,可以使用`selectionStart`属性。例如,对于一个ID为`myInput`的元素,你可以这样获取: ```javascript var cursorPos = $('#myInput').prop('selectionStart...

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

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

    通过javascript在光标处插入文本

    Firefox、Chrome等现代浏览器支持`selectionStart`和`selectionEnd`属性,可以直接获取光标位置。而IE浏览器则需要使用`document.selection`对象来获取光标位置。 在我们的示例代码中,我们使用了以下代码来获取...

    js获取光标位置和设置文本框光标位置示例代码

    对于非IE浏览器,如Chrome和Firefox,可以使用`selectionStart`属性来获取光标位置。例如: ```javascript function getCursorPosition(inputElement) { return inputElement.selectionStart; } ``` 对于IE浏览器,...

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

    对于textarea和input text,可以通过element.selectionStart属性来直接获取光标位置。但对于可编辑的div元素,这种属性则不可用。 为了兼容各种浏览器,需要对不同浏览器进行检测并采取不同的处理策略。在上述代码...

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

    特别是在交互式应用中,我们经常需要获取或设置用户输入时的光标位置、选中文字的起始和终止位置,以及获取选中的文字内容。这些功能可以帮助我们实现更丰富的用户交互体验,比如自动补全、高亮显示等。以下是对这些...

    用javascript获取textarea中的光标位置

    对于写javascript写网页编辑器的人来说,获取textarea中的光标位置是一个非常重要的问题,而往往很多人在这个地方不知所措,找不到好的办法。昨天我在网上找到了一段javascript代码,本来不想把原版放在这里的,就是...

    DIV可编辑模式在光标位置插入内容

    关于在光标位置插入内容,JavaScript提供了获取和操作光标位置的方法。在可编辑元素中,我们可以通过`document.getSelection()`获取当前选区的信息,然后通过`Range`对象进行操作。以下是一个简单的示例,展示了如何...

    javascript 光标定位例子

    例如,你可以通过`element.selectionStart`获取光标当前位置,通过`element.setSelectionRange(start, end)`设置光标和选取的范围。 在jQuery库中,虽然没有直接提供处理光标位置的API,但可以通过jQuery对象的`....

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

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

Global site tag (gtag.js) - Google Analytics