【问题标题】:Focus on a textarea to the last + 1 character cursor, javascript [duplicate]专注于文本区域到最后一个 + 1 个字符光标,javascript [重复]
【发布时间】:2013-06-26 11:02:13
【问题描述】:

我的javascript 文件中有这部分代码

function insertRespuesta(id, attach)
{
    document.getElementById(attach).value += " #" + id + " ";
    document.getElementById(attach).focus();
}

我的html 文件:

<textarea name="textoConversacion" id="textoConversacion" class="mensaje-mensajeria"></textarea>
<a href='#' class='decoracion-link' onClick="insertRespuesta('<?php echo $cada['contador']; ?>','textoConversacion');">#<?php echo $cada['contador']; ?></a>

因此,如果我单击link,它将专注于 textarea,但 textarea 光标将位于我的最后一个位置,我需要输入最后一个光标字符 + 1。

我更喜欢not using jquery

【问题讨论】:

    标签: javascript focus hyperlink cursor-position


    【解决方案1】:

    来自不使用jQuery的linked answer

    function insertRespuesta(id, attach)
    {
        var el = document.getElementById(attach)
        if(el != null)
        {
            el.value += " #" + id + " ";
            setCaretPosition(attach, el.value.length);
        }
    }
    
    function setCaretPosition(elemId, caretPos) {
        var elem = document.getElementById(elemId);
    
        if(elem != null) {
            elem.focus();
            if(elem.createTextRange) {
                var range = elem.createTextRange();
                range.move('character', caretPos);
                range.select();
            }
            else if(elem.selectionStart) {
                elem.setSelectionRange(caretPos, caretPos);
            }
        }
    }
    

    这是working jsFiddle

    【讨论】:

    • 感谢@DaveRager 的回答。很好,但是例如,如果我没有写任何东西,光标将保持在开头,jsfiddle.net/bHfvY/1 - 我正在像论坛一样这样做,如果您单击帖子nº,您将获得自动报价,并且通常您会在文本区域(或类似区域)中写入任何内容之前单击。
    • PS:我想我是这样修复的:jsfiddle.net/bHfvY/3 但我不确定,因为我从未使用过 javascript 的那些函数(比如那个函数)所以我不确定是否在某些情况下它会失败,但再次感谢。
    • @rokimoki 那么你想要的是将光标定位在现有文本之后和插入文本之前之前?像这样:jsfiddle.net/bHfvY/4 你最后的小提琴仍在将光标移动到我的 Firefox 浏览器的末尾,但看起来这就是你想要做的。如果是这样,我会更新我的答案。
    • 有时我会混淆光标位置的最终/结束,我想要准确和文本区域的最后一个字符,考虑到 #id 添加之后。
    猜你喜欢
    • 1970-01-01
    • 2010-10-12
    • 1970-01-01
    • 2015-03-06
    • 2016-08-06
    • 1970-01-01
    • 2011-12-19
    • 2011-12-24
    • 1970-01-01
    相关资源
    最近更新 更多