使用jQuery語法突出顯示亮點在html textarea中突出顯示Java代碼

我正在jsp中構建一個web-app。我有一個textarea，程序員在其中編寫他的java代碼，我想突出顯示textarea內部的Java代碼。使用jQuery語法突出顯示亮點在html textarea中突出顯示Java代碼

到目前爲止，我已經做了：

 <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <script type="text/javascript" src="scripts/Javascript Libraries/jquery.snippet.js"></script> 
     <link rel="stylesheet" type="text/css" href="scripts/Javascript Libraries/jquery.snippet.css" /> 

     <script> 
     $(document).ready(function(){ 
      $("pre.javacode").snippet("java",{style:"blue"}); 
     }); 
     </script> 

     </head> 

<form id="mypage" action="NewAction.jsp" method="GET"> 

     <p>Please write in your main class name </p> 
     <input type="text" ng-model="codename" name="filename" value="Example" required> 
     <p><i>Please write your code here :</i></p> 

     <pre class="javacode"> 
     <textarea id="codearea" name="jcode" rows="20" cols="100" spellcheck="false" autofocuts> 

     import java.io.*; 
     import java.util.*; 

     class {{codename}} 
     { 
     public static void main(String[]args) 
     { 

     } 
     } 

     </textarea> 
     </pre> 
     <br /> 
     <b>stdin:</b> 
     <br /> 
     <input type="text" name="arg" value="" > 

     <input type="submit" name="Submit" value="Submit" id="submitter" > 
     <input type="button" name="reset" value="Reset" onclick="location.reload(true);"> 
     </form>

和輸出我得到的是：

Output to the above code in browser

需要更多關於語法高亮一些指導。

來源

2015-04-17 Mayank

textarea沒有您需要的功能。它只能顯示純文本，因此忽略所有樣式，HTML元素和特殊字符。

嘗試編輯部件，如CodeMirror或ACE。

來源

2015-04-17 15:16:07

謝謝您提出ACE，它對於所需目的很有效。 – Mayank

使用jQuery語法突出顯示亮點在html textarea中突出顯示Java代碼

回答

相關問題