テキストエリアや入力に必要な単語があります

Question

私は自分のウェブサイトのコーディングエリアを作っていますが、色分けされた（シンタックスハイライト）必要があります。私のために正解を見つけ、ここに私のコードがあります。 そして私はJquery

HTML使用しています：

<textarea class="CodeArea codingground"> 

    <div class="HelloMate"> 

    </div> 

</textarea> 

JS：

$(function(){ 

$('.CodeArea.codingground').on('input',function(){ 
    var code = $(this).val(); 

    if (code.indexOf('class')>=0) { 
    $("textarea:contains('class')").css("color", "red"); 
    } 

}); 

}); 

Answer 1

これはtextareaでは不可能です。

<code>タグは、contenteditable属性と組み合わせて使用​​できます。いくつかのJavascriptとあなたはあなたが望むものを得るでしょう、たとえそうしたもののためにライブラリを使うべきだと思うべきです。

var text = jQuery('code').text(); 
 
text = text.replace('class', '<span style="color: red">class</span>'); 
 
jQuery('code').html(text);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<code contenteditable="true"> 
 
    class Blubb() { 
 

 
    } 
 
</code>