如何在textarea jquery中只为一行着色答案

【问题标题】：how color only one line in textarea jquery如何在textarea jquery中只为一行着色
【发布时间】：2016-11-03 15:33:47
【问题描述】：

我需要用 jquery 为选定的行着色。假设我有一个文本区域，其中有一行。当用户单击文本区域时，我需要 tp 为单击的行着色。所以我使用这个代码：

$(document).on("mouseup", '#scroll_bar', function(eventData) {
        console.log("DELLLLLLLLL");
        var scrollPosition = $(this).scrollTop()
        var lineHeight = $(this).css("line-height");
        lineHeight = parseInt(lineHeight.substring(0, lineHeight.length - 2));

        var line = Math.floor((eventData.offsetY + scrollPosition) / lineHeight);

        alert($(this).val().split("\n")[line]);
    });

但我找到了用户单击的行，但我不知道如何选择橙色等颜色。谁能帮帮我？

【问题讨论】：

你不能只为文本区域的部分着色，要么全有，要么全无。
@adeneo 你是对的，但是不覆盖整个文本区域的背景呢，例如使用背景图像或线性渐变？想想更有创意;-)（就像在 daanvanham 的回答中）
@RogierSpieker - 这实际上很漂亮，我的支持，但你仍然不能在文本区域中为线条着色，但我承认线性背景是一种诡计，给人的印象相同.

标签： javascript jquery html

【解决方案1】：

可以使用背景图像为文本区域的一行（或多行）着色。

这里有一个示例，如何使用线性渐变作为背景图像。

background: linear-gradient(to bottom, #fff 0px, red 0px, red 22px, #fff 22px);
background-position: 20px;

Working example

【讨论】：

我试过了，但是当你滚动 textarea 时它不会滚动。