按 enter 进行 1 次输入时防止提交表单

Question

我已经看到了this answer，但我想在仅输入 1 次输入时禁用提交表单。

<form>
  <input type="text" name="enterNotDisabled">
  <input type="text" name="enterDisabled">
  <button type="submit">
</form>

例如，我希望当焦点在第一个输入上时，您可以按回车键提交表单，但第二个输入将禁用此功能。

感谢您的帮助。

Answer 1

Javascript

<form id="form">
  <input type="text" name="enterNotDisabled">
  <input type="text" name="enterDisabled">
  <button type="submit">
</form>

<script type="text/javascript">
    document.querySelector("#form").addEventListener("submit", function(e){
        console.log('event')
        e.preventDefault();
    });

</script>

jQuery

<form id="form">
  <input type="text" name="enterNotDisabled">
  <input type="text" name="enterDisabled">
  <button type="submit">
</form>

<script type="text/javascript">
    $('#form').submit(function(ev) {
        console.log('event')
        ev.preventDefault();
    });

</script>

Answer 2

只需捕捉该字段上的 "Enter" 键事件。

简单的例子：

<form>
  <input type="text" name="enterNotDisabled">
  <input type="text" name="enterDisabled" id="input2">
  <button type="submit">
</form>

JS

function catchSubmit(evt) {
  if (evt.code === 'Enter') {
        evt.preventDefault();  
  }
}
document.getElementById('input2').addEventListener('keypress', catchSubmit, false);

按 enter 进行 1 次输入时防止提交表单

Prevent submitting of form when pressing enter for 1 input

javascript

html

forms

html-input