как выделить часть HTML-кода textarea

Question

Я хочу получить регулярное выражение для веб-версии Python, и я сталкиваюсь с проблемой, как выделить значения совпадения другим цветом (переключение между желтым и синим) в текстовой области, там есть демонстрация, что именно я хочу на http://regexpal.com,but Я был новичком на JS, я не понимал его кодового значения.Любой совет ценится

Answer 1

Чтобы сэкономить время, вы должны рассмотреть возможность использования существующей библиотеки для этого требования.

Цитата здесь :

Поскольку элементы textarea не могут отображать HTML, этот плагин позволяет выделять текст внутри элементов textarea.

jQuery highlightTextarea .

Демо: Codepen

Использование:

$context.highlightTextarea(options);

Answer 2

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

Например:

<code><pre id="view">

Когда вы набираете #code, оно копирует значение, применяет фильтры и добавляет HTML в #view.

var code = document.getElementById("code");
var pre = document.getElementById("pre");
(code).onkeyup = function (){
    val = this.value;
    val = YourRegex(val);
    (pre).innerHTML = val;
};

YourRegex будет методом для сопоставления regex и возврата некоторого проанализированного содержимого в pre, что позволит вам настроить внешний вид textarea (который фактически является элементом над ним). *

function YourRegex(val)
{
    // This function add colors, bold, whatever you want.
    if (/bbcc/i.test("bbcc"))
        return "<b>" + val + "</b>";
}

Answer 3

@ Решение BrunoLM превосходно, но может потребовать больше взлома, чем вам удобно.Если вы заинтересованы (и если jQuery уже находится в вашем стеке), возможно, стоит взглянуть на следующий плагин:

http://garysieling.github.io/jquery-highlighttextarea/