我可以使用JavaScript将TEXTAREA滚动到特定行号吗？

64jmpszr 于 2023-10-14 发布在 Java

关注(0)|答案(1)|浏览(112)

一个多行TEXTAREA元素。
给定一个整数，它表示TEXTAREA中包含的文本字符串中的特定行号（由字符串中的换行符分隔，而不是元素中的文本 Package --所以 * 实际 * 行，而不是TEXTAREA中字符串的可视行），我可以使用JavaScript将TEXTAREA滚动到该行号吗？
大多数滚动似乎是按像素的，这是不起作用的（即使你假设你有任何行高是准确的），因为长的行会换行，这意味着实际的行号与可视的行号不匹配。

JavaScript

来源：https://stackoverflow.com/questions/77247447/can-i-scroll-a-textarea-to-a-specific-line-number-using-javascript

1条答案

按热度按时间

eqqqjvef1#

试试这个：HTML：

<!DOCTYPE html>
<html>
<head>
    <title>Focus on Line</title>
</head>
<body>
    <textarea id="textarea" autofocus style="height:200px;">
0123456781
0123456782
0123456783
0123456784
0123456785
0123456786
0123456787
0123456788
0123456789
0123456710
0123456711
0123456712
0123456713
0123456714
0123456715
0123456716
0123456717
0123456718
0123456719
0123456720
    </textarea>
    <button onClick="go(5)">Go Line 10</button>
    <button onClick="focusToTxt()">Focus</button>
    </body> </html>

JavaScript语言：

var startLength = 0; 

function go(line)
{
    function lineFocus(textarea,line) { 
        var lines = textarea.value.split('\n');

        if (line >= 0 && line < lines.length) { 
        var lineHeight = textarea.scrollHeight / lines.length;

        textarea.scrollTop = lineHeight * line;

        }

        for(var index=0; index < lines.length; index++)
        {
            if(index==(line-1))
            { 
                break;
            }
            startLength+=lines[index].length+1;

        }
    }

    var textarea = document.getElementById('textarea');  
    lineFocus(textarea,line);
}

function focusToTxt(){
    var textarea = document.getElementById('textarea');  

    textarea.focus({focusVisible :true});

    textarea.selectionStart=startLength;

    textarea.selectionEnd=startLength+1;
    startLength=0;
}

示例：https://jsfiddle.net/6xbfrzqg/1/
注意：我创建了两个按钮，一个用于移动scroll，另一个用于移动焦点。但是你可以使用这两个函数，但是你需要在一段时间后运行第二个函数来释放GUI，在焦点之前更新滚动条。尝试使用下面的代码（不要使用JSFiddle）

setTimeout(200,focusToTxt());

赞(0）回复(0）举报 2023-10-14

我来回答

我可以使用JavaScript将TEXTAREA滚动到特定行号吗？

1条答案

相关问题

热门标签

最新问答