• Home
  • Jobs
  • Courses
  • Questions
  • Teachers
  • For business
  • ES/EN

0

38
Views
Applying CSS to only certain lines in textarea

I have a textarea that needs green color for the line that begins with double slash(//).

<textarea id="code-init" spellcheck="false"></textarea>

now I have used following code to attempt what I thought,

document.getElementById("code-init").onkeyup = e => {

if(e.key === '/') {
    console.log(e.key)
    document.getElementById("code-init").onkeyup = e =>{
        if(e.key === '/')
            e.target.style.color = "green"
        document.getElementById("code-init").onkeyup = e =>{
            if(e.key === "Enter")
                e.target.style.color = "white"
         }
     }
  }
}
about 1 month ago ·

Juan Pablo Isaza

1 answers
Answer question

0

You could simulate an div and insert each letter as span. Callback and check if they include // then traverse the characters to define "a line" and color the spans of the "line"? http://jsbin.com/qinacusuzo/edit?html,output

Or use linear gradient to color the background of the textarea: https://jsfiddle.net/c6hzg08d/

A hard task, maybe worth looking for libraries that help you achieve this.

about 1 month ago · Juan Pablo Isaza Report
Answer question
Find remote jobs
Loading

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post job Plans Our process Sales
Legal
Terms and conditions Privacy policy
© 2022 PeakU Inc. All Rights Reserved.