JSFiddle - React, Tailwind, and code Playground
by Bart Kalisz
HTML
<input id="q" type="text" autocomplete="off"/>
<div>
Valid URL? <span id="i"></span>
</div>
JavaScript
const input = document.getElementById("q");
const infoBox = document.getElementById("i");
input.addEventListener("input", (event) => {
if (isValidURL(event.target.value)) {
infoBox.innerText = "Yes";
} else {
infoBox.innerText = "No";
}
});
function isValidURL(string) {
try {
new URL(string);
return true;
} catch (_) {
return false;
}
}