Как я могу прокрутить до указанной строки в поле расширенного текста с помощью сценария Java

Question

У меня есть div со многими текстовыми строками. Div ограничен по высоте, и поэтому у меня есть scroll. Есть ли способ в java script прокрутить до указанной строки.

Если бы это было на странице html, я всегда могу сделать это с помощью закладок, как это сделать для форматированных текстовых полей или любого html container с помощью сценария Java.

Любая помощь высоко ценится.

Nandish

Answer 1

Здесь у вас проблема с понятием «линия». Поскольку в браузере отображается окно с заданной шириной (может быть динамическим) и текстом внутри него, строки зависят от переноса.

Например, текст: «Привет, мне нужна моя пицца сейчас» будет состоять из двух строк, если ширина действительно мала, или из одной строки, если ширины достаточно, чтобы уместиться в этот текст.

Что я имею в виду под этим, так это то, что «линия» является понятием относительно самой обертки, поэтому даже подсчет строк внутри div невозможно .

Другое дело, если ваши строки определены пользователем, с помощью перевода строки и возврата каретки, или с помощью
или чего-то еще, но если строки генерируются переносом, это происходит во время рендеринга, и у вас есть понятия не имею, как это произойдет.

Если у вас фиксированный размер шрифта, вы можете спекулировать количеством строк простым делением высоты блока / размера шрифта + пробела между строками.

Однако, если ваш текст насыщенный, он может содержать изображения и т. Д., И это не сработает.

Другое возможное решение - использовать getClientRects (у меня это сработало)

https://developer.mozilla.org/en/DOM/element.getClientRects

, который возвращает коллекцию текстовых прямоугольников:

http://help.dottoro.com/ljgupwlp.php

Надеюсь, это немного поможет, я сталкивался с этой проблемой два раза раньше, и это не так просто, как вызов функции, вы должны понимать, что означает строки, переносы, клиентские строки, текстовые прямоугольники, шрифты ...

Удачи!

Answer 2

Если вы имеете в виду <div contenteditable="true">, вы можете попробовать это: http://jsfiddle.net/cMMy5/.

В основном это свойство scrollTop элемента div.

$div = $('div');
$('button').click(function() {
    $div.get(0).scrollTop = 10;
});