JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" id="domain">
JavaScript
$(document).ready(function(){
function ValidUrl(str) {
var pattern = new RegExp('^(https?:\\/\\/)?'+ // protocol
'((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name
'((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address
'(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path
'(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string
'(\\#[-a-z\\d_]*)?$','i'); // fragment locator
if(!pattern.test(str)) {
return false;
} else {
return true;
}
}
$('#domain').change(function(){
var str = $.trim($(this).val());
if(ValidUrl(str)){
var pat = /^(https?:\/\/)?(?:www\.)?([^\/]+)/;
var match = str.match(pat);
console.log(match);
//$(this).val(str);
}
else{
$(this).val('Validation failed');
}
});
});