• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

152
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 3 years 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 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

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

Andres GPT

Recommend me some offers
I have an error