时间戳

首页 > 解决方案 > 在 html 文本框/文本区域中显示特定行

html - 在 html 文本框/文本区域中显示特定行

问题描述

所以我有一个 HTML 文本框/文本区域，在里面，我们显示一些文本。现在文本框大约有 4 行高，但文本可以多几行，因此我们启用了滚动。

但是，我想要的是某个行号或者从输入文本开始的可能行自动滚动到 html txtbox/textarea 中的第一行。

怎么可能做到这一点？

标签： html

解决方案

我不知道如何使用 htmltextarea或来做到这一点text box，我已经广泛尝试将textarea内容与盒子分开设置样式，但研究表明这是不可能的。但是，您可以“模仿”带有div, 的文本框来选择内容可见性的开始位置并具有完整的 CSS 样式。里面的文字div会自动滚动到第二段。您仍然可以向上滚动并阅读以前的文本。

window.onload = function() {
var begintext = document.getElementById('begin');
var topstart = begintext.offsetTop;
document.getElementById('textarea').scrollTop = topstart;
};
/* optional font family import */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/raleway/v13/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
}

#textarea {
    position: relative;
    -webkit-appearance: textarea;
    -moz-appearance: textfield-multiline;
    border: 1px solid gray;
    height: 28px;
    padding: 2px;
    resize: both;
    width: 400px;
    height: 100px;  
    overflow: auto; 
    font-family: Raleway, sans-serif;
    font-size: 0.79rem;
    line-height: 0.95rem;
    text-align: justify;
    padding: 0 0.8rem;
}
<div id = "textarea">
<p>Delicacy is prized in pinot noir and riesling. In California, the main stylistic difference in Cabernet Sauvignon is between hillside / mountain vineyards and those on flatter terrain like valley floors.
A wine has legs if it sticks to the inside of the glass when swirled. A lingering finish indicates a luscious vintage!</p>
<span id = "begin"><p>Burgundy is the definition of a strong red. Fruity flavors, with aromas of rose petals, peaches, and allspice. Grapes crushed and ready for fermentation are called must. All grape juice is white, only the skins of purple grapes contain the dark pigment. A "butt" is a medieval measurement for the liquid volume of wine. Acid, tannin, fruitiness, oakiness, are all components of balance.</p></span>
<p>Trichloroanisole in the cork can impart musty, mouldy overtones. Such a wine is called "corked." Egg whites are sometimes used in the clarification process. The best wines impart a lingering, complex and rich finish. Text from www.wineipsum.com</p>
</div>

推荐阅读