表单提交没有'调用return false后无法工作

Form submit doesn't work after calling return false

本文关键字：false 工作 return 调用 表单提交      更新时间：2023-09-26

我有以下代码。

function stop() {
  $("#login_form").submit(function(e) {
    return false;
  });
}
function login() {
  var username = $("input[name=username]").val();
  var password = $("input[name=password]").val();
  if (username.length < 1) {
    alert("Please enter your username or email address.");
    stop();
  } else if (username.length > 0 && username.length < 3) {
    alert("Your username or email is incorrect.");
    stop();
  } else if (password.length < 1) {
    alert("Please enter your password.");
    stop();
  } else if (password.length > 0 && password.length < 6) {
    alert("Your password is incorrect.");
    stop();
  } else if (username.length > 2 && password.length > 5) {
    $("#login_form").submit(function(e) {
      return true;
    });
  }
}

如果我最初输入了正确的值，表单就会提交。但是，如果只调用一次"return false"，则不会提交。

我该怎么解决这个问题？调用"return true"无效。

编辑

我的html表单：

<form id='login_form' action='login.php' method='post'>
  <div id='form_item'>
    <div id='form_item_left' style='width: 40%; margin-left: -75px; font-size: 18px;'>Username or Email</div>
    <div id='form_item_right'>
      <input id='text' type='text' name='username'>
    </div>
  </div>
  <div id='form_item'>
    <div id='form_item_left' style='font-size: 18px;'>Password</div>
    <div id='form_item_right'>
      <input id='text' type='text' name='password'>
    </div>
  </div>
  <div style='height: 5px;'></div>
  <div id='form_item'>
    <div id='form_item_right'>
      <span style='display: inline-block; width: 60px;'></span>
      <input id='checkbox' type='checkbox' name='remember_me'>
      <span>Remember me</span>
    </div>
  </div>
  <div style='height: 15px;'></div>
  <div id='form_item' style='text-align: center;'>
    <input id='submit' type='submit' name='submit' value='Login'>
  </div>
</form>

根据我的经验，只需使用event.preventDefault();而不是返回false。

您使用login（）和stop（）的设置似乎过于复杂，在这种情况下，您似乎没有正确使用jQuery-submit-就像您使用它的方式一样，它将事件处理程序绑定到submit事件，这就是它停止工作的原因-因为您将对该表单中的任何submit事件返回false。

$("#login_form").submit(function (e) {    
    if(condition){
        alert("Error");
        e.preventDefault();
    } else if(condition){
        alert("Error");
        e.preventDefault();
    } else if(condition){
        alert("Success");
        // Do Something
    }
});

我认为这样的东西更接近你的需求。如果提交时出现错误，请使用preventDefault，如果全部签出，请在没有preventDefault的情况下执行操作。

再次记住，$("element").submit(function (e) {将事件处理程序绑定到提交事件，而不是触发提交事件。

好的，我终于找到了解决方法。

以下代码运行良好。

var eventhandler = function(e) {
  e.preventDefault();
}
function login() {
  var username = $("input[name=username]").val();
  var password = $("input[name=password]").val();
  if (username.length < 1) {
    alert("Please enter your username or email address.");
    $("#login_form").bind('submit', eventhandler);
  } else if (username.length > 0 && username.length < 3) {
    alert("Your username or email is incorrect.");
    $("#login_form").bind('submit', eventhandler);
  } else if (password.length < 1) {
    alert("Please enter your password.");
    $("#login_form").bind('submit', eventhandler);
  } else if (password.length > 0 && password.length < 6) {
    alert("Your password is incorrect.");
    $("#login_form").bind('submit', eventhandler);
  }
  if (username.length > 2 && password.length > 5) {
    $("#login_form").unbind('submit', eventhandler);
  }
}

相关文章：