Fixed Input Prefix
Enforce data formats. This script locks the beginning of an input field so users cannot accidentally remove required prefixes like currency symbols or protocol headers.
Copy the Script
<script>
function checkPrefix(el, prefix) {
if (el.value.indexOf(prefix) !== 0) {
// If prefix missing, add it back
el.value = prefix + el.value.replace(prefix, "");
// Note: Simple replace logic, better regex recommended for strict cases
}
}
</script>
<input type="text" value="http://" oninput="checkPrefix(this, 'http://')">
Frequently Asked Questions
Visual prefixes (like Bootstrap Input Groups) are usually better because they don't mess with the data value. However, this script is useful if you *must* have the prefix included in the submitted data string.
Yes, but you can add logic to set the selection range to the end of the prefix on click/focus to prevent editing the prefix characters.
Yes. The `oninput` event fires on paste, so if a user pastes a value that overwrites the prefix, the script will re-add it immediately.