Question

我有这个简单的表格

<form action="http://localhost/my_project/account_control" id="generate" method="post" accept-charset="utf-8">
  <div class="form-group">
    <label for="personnel">Personnel Password</label>
    <input class="form-control panel__input-container" name="personnel" type="password" placeholder="password" value="">
  </div>
  <div class="form-group">
    <div class="authority__button-container center-block">
      <button type="button" class="btn btn-default button--dark" id="reset-save"><span><i class="fa fa-save"></i></span> SAVE</button>
    </div>
  </div>
</form>

我的程序正在使用 ajax 在登录用户点击按钮时以给定的表单属性action="http://localhost/my_project/account_control"提交数据。

这是ajax。

$('#reset-save').click(function() {
  url     = $(this).parents('form').attr('action') + '/reset_user_password';
  form_id = $(this).parents('form').attr('id');

  $.ajax({
    type: "POST",
    url: url,
    data: $('#'+form_id).serialize(),
    dataType: 'JSON',
    success:(result) => { // My Message Here },
    error: function(result) { // My error message here },
    beforeSend: function() { },
    completes: function() { }
  }); // end of ajax

});

问题是，如果用户输入密码太快而突然点击键盘上的enter，表单会触发提交并导致页面出错。

如何禁用它？

Answer 1

您可以阻止输入键事件。因此表单不会直接提交，用户需要按保存按钮提交表单。

$(document).keypress(function(e) {
    if(e.which == 13) {
        e.preventDefault();
    }
});

如果单击输入，则阻止表单提交

1 个答案: