語法高亮顯示未檢測到新的生產線

Question

我使用這個插件突出的textarea：

http://www.jqueryscript.net/text/jQuery-Based-Text-Highlighter-For-Textarea.html

$('textarea').textareaHighlighter({ 
    matches: [ 
    { 
     'match': ['hello','dear','this is a test', 'text to match'], // will check for this matches 
     'matchClass': 'match'    // on matched text this class will be added 
    } 
    ] 
}); 

的顏色出現，而不是在好的地方，也沒有檢測結束線。

當我啓動調試模式：

$('textarea').textareaHighlighter({ 
    debug: true, 
    matches: [ 
     { 
     'match': ['hello','dear','this is a test', 'text to match'], // will check for this matches 
     'matchClass': 'match'    // on matched text this class will be added 
    }, 
     { 
      'match': /([\%'])(?:(?=(\\?))\2.)*?\1/g, 
      'matchClass': 'tags' 
     } 
    ] 
}); 

我得到這樣的結果：

這裏演示 https://jsfiddle.net/9at1jgfv/1/

Answer 1

最後在網頁源搜索一小時後： http://www.jqueryscript.net/demo/jQuery-Based-Text-Highlighter-For-Textarea/

我找到了解決辦法，通過添加類：

.target { 
     overflow: hidden; 
     border: 1px solid #ddd; 
     border-radius: 3px; 
     resize: none; 
     white-space: pre-wrap;  <----------------- the magic solution 
     background-color: #f9f9f9; 
     -webkit-appearance: none; 
    } 


<textarea class="target" name="message" required="true" style="width:600px; height:470px;"> hello, 

    I'm using this is a test. 

    thank you dear 
</textarea> 

，我希望這會幫助別人的未來。