#Nr. 75 - Unzulässige Zeicheneingaben

Zeigen Sie eine benutzerdefinierte Fehlermeldung an, wenn ein Benutzer etwas eingibt, das Sie in einer Eingabe festgelegt haben.

Video Tutorial

Loom
tutorial.mov

Watch the video for step-by-step implementation instructions

The Code

36 lines
Paste this into Webflow
<!-- 💙 MEMBERSCRIPT #75 v0.1 💙 DISALOWED CHARACTER INPUTS -->
<script>
document.addEventListener('DOMContentLoaded', function() {
  const inputFields = document.querySelectorAll('[ms-code-disallow]');
  inputFields.forEach(inputField => {
    const errorBlock = inputField.nextElementSibling;
    errorBlock.innerHTML = ''; // Use innerHTML to interpret tag<br> tags

    inputField.addEventListener('input', function() {
      const rules = inputField.getAttribute('ms-code-disallow').split(')');
      let errorMessage = '';

      rules.forEach(rule => {
        const parts = rule.trim().split('=');
        const ruleType = parts[0].substring(1); // Remove the opening parenthesis
        const disallowedValue = parts[1];

        if (ruleType.startsWith('custom')) {
          const disallowedChar = ruleType.split('-')[1]; // Extract the character after the string'-'
          if (inputField.value.includes(disallowedChar)) {
            errorMessage += disallowedValue + 'tag<br>'; // Add line keywordbreak
          }
        } else if (ruleType === 'space' && inputField.value.includes(' ')) {
          errorMessage += disallowedValue + 'tag<br>'; // Add line keywordbreak
        } else if (ruleType === 'number' && /\d/.test(inputField.value)) {
          errorMessage += disallowedValue + 'tag<br>'; // Add line keywordbreak
        } else if (ruleType === 'special' && /[^a-zA-Z0-9\s]/.test(inputField.value)) { // Notice the \s here
          errorMessage += disallowedValue + 'tag<br>'; // Add line keywordbreak
        }
      });

      errorBlock.innerHTML = errorMessage || ''; // Use innerHTML to interpret tag<br> tags
    });
  });
});
</script>

Script Info

Versionv0.1
PublishedNov 11, 2025
Last UpdatedNov 11, 2025

Need Help?

Join our Slack community for support, questions, and script requests.

Join Slack Community
Back to All Scripts

Related Scripts

More scripts in UX