Skip to content

Recommend Gemeos to your network and earn a commission

Discover our referral program
Let’s talk?

CRO / Conversion2 min read

How to Prevent Form Submission with Enter in Webflow

Learn how to prevent accidental Webflow form submissions when someone hits Enter.

In this tutorial, Sandro, cofounder of the Gemeos Webflow agency, shows you how to prevent accidental form submissions in Webflow when someone hits Enter.

Example

Press Enter in the fields: nothing happens. The textarea still accepts Enter as usual.

Try Enter in the inputs above

Use caseProblemSolution
Multi-field formEnter in the first field submits everythingBlock Enter on text inputs
Search formEnter triggers an unwanted searchHandle Enter manually
Multi-step formEnter skips stepsBlock it and manage progression

The script

document.querySelectorAll('form').forEach(function(form) {
  form.addEventListener('keydown', function(e) {
    if (e.key === 'Enter' && e.target.tagName !== 'TEXTAREA') {
      e.preventDefault();
    }
  });
});

Variation: allow Enter only on the last field

To allow submission with Enter only from the last input in the form:

document.querySelectorAll('form').forEach(function(form) {
  var inputs = form.querySelectorAll('input, select');
  var last = inputs[inputs.length - 1];
  form.addEventListener('keydown', function(e) {
    if (e.key === 'Enter' && e.target !== last && e.target.tagName !== 'TEXTAREA') {
      e.preventDefault();
    }
  });
});

Conclusion

This snippet prevents accidental submissions on complex forms. See also: design frictionless forms.

Published on May 19, 2026

Sandro DA SILVA

Growth Marketer, Webflow expert, and jack-of-all-trades. Sandro handles commercial operations, ensures projects run smoothly, and addresses marketing-related issues (SEO, Tracking, Copywriting, etc).

You might be interested in these tutorials

Related tutorials

See all

You're going to working with us, guaranteed

Ready to launch your business?

get a quote

Let’s f*****G GO !!