javascript - 如何在 jquery 文本区域中仅对一行进行颜色处理

Question

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

$(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]);
    });

但是我找到了用户单击的行，但我不知道如何使用橙色等颜色进行选择。有人可以帮助我吗？

Answer 1

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

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

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

Working example