Last active
September 29, 2017 14:09
-
-
Save Phuseos/cd82deefdd126c1554bfff5d74e265a8 to your computer and use it in GitHub Desktop.
Simple RGB colour validation test using jQuery and regex
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js" ></script> | |
| </head> | |
| <body> | |
| <input id="txtValue" type="text" placeholder='Type your RGB code here!'/> | |
| <div id="testValidation" ></div> | |
| <script> | |
| //JQuery keyPress event for validation | |
| $('#txtValue').keyup(function() { | |
| var value = $("#txtValue").val(); | |
| var regex = /(?:#|0x)?(?:[0-9A-F]{2}){3,4}/; | |
| if (!regex.test(value) || value == "") | |
| document.getElementById('testValidation').innerHTML = ("<p>Invalid RGB code.</p>"); | |
| else | |
| document.getElementById('testValidation').innerHTML = (`<p>VALID RGB code.</p><p style="color:${value}">Your colour looks like this!</p>`); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment