JSFiddle - React, Tailwind, and code Playground

by HYEONGJINKIM

HTML

Format: Foo Bar<br />
<input type="text" autofocus />
<input type="submit" />

CSS

body {
    background: #EEE;
    font-family: arial;
    font-size: 8pt;
}

input[type="text"] {
    outline: none;
    border: solid 1px #CCC;
}

JavaScript

//http://www.ninjavspenguin.com/regexp.html
function check(input) {
    
    var regex = new RegExp("^[A-Z]{1}[a-z]+ [A-Z]{1}[a-z]+$");
    return regex.test(input);
    
}

$("input[type='submit']").fadeOut(0);

$("input[type='text']").keyup(function() {
     if(check($(this).attr("value"))) {        
        $(this).css("border-color", "#090");
        $("input[type='submit']").fadeIn(250);        
    } else {        
        $(this).css("border-color", "#900");        
    }
});