loading...

Checking if an input is empty with CSS

Zell Liew πŸ€— on December 18, 2018

Is it possible to know if an input is empty with only CSS? I had that question when I tried to make an autocomplete component for Learn JavaScri... [Read Full]
markdown guide
 

Hi Zell, great article!

This regexp should work: \s?\S+.*

it means: 1 optional space followed by at least one non space followed by whatever.

I tested it and:

  • one space = red
  • one space followed by one non space = green
  • more than one space followed by anything = red
  • spaces between chars = green
 
 
 

Try pattern=β€œ\S+β€œ which means has to contain 1 or more non-white-space characters

 

Since pattern works like new RegExp('^'+pattern+'$'), this won't work if there are white-space characters in the input value.

 
 

This is pretty cool. Thanks for sharing Zell. :)

code of conduct - report abuse