如何防止按下回车键时提交表单？

防止按 ENTER 键提交表单

在基于 Web 的应用程序中，防止按 ENTER 键提交表单可确保表单仅在当用户明确单击提交按钮时提交。这种方法增强了用户体验并防止意外的表单提交。

要防止 ENTER 键触发表单提交，您可以使用以下代码片段：

function checkEnter(e) {
  e = e || event;
  var txtArea = /textarea/i.test((e.target || e.srcElement).tagName);
  return txtArea || (e.keyCode || e.which || e.charCode || 0) !== 13;
}

一旦定义了checkEnter 函数，您可以将其作为按键处理程序附加到表单：

<form [...] onkeypress="return checkEnter(event)">

或者，您可以使用以下 ES20xx 方法：

document.addEventListener(`keypress`, handle);

function handle(evt) {
  const form = evt.target.closest(`#testForm`);
  if (form) {
    if (evt.target.dataset.enterForSubmit) {
      if (evt.key === `Enter`) {
        evt.preventDefault();
        return logClear(`won't submit "${evt.target.value}"`);
      }
      return true;
    }
  }
}

此方法使用事件委托来防止按下 ENTER 键时提交表单，允许用户在 textarea 元素中输入多行文本而不触发提交。

以上是如何防止按下回车键时提交表单？的详细内容。更多信息请关注PHP中文网其他相关文章！