javascript - 使用 jQuery 防止回发并运行 OnClick

Question

我正在尝试验证文本框并单击 asp.net 的按钮。

<asp:TextBox ID="txtEmail" Placeholder="E-mail" runat="server"></asp:TextBox>
<asp:Button ID="btnLogin" OnClick="btnLogin_Click" runat="server" Text="Login" />

这里是一个 jQuery 代码，它验证 TextBox，然后触发 OnClick 方法:

var al = document.getElementById('<%=lblAlert.ClientID%>');
var email = document.getElementById('<%=txtEmail.ClientID%>');
var msg = null;
$(document).ready(function () {
  $('#<%=btnLogin.ClientID%>').on('click', function (e) {
      if (email.innerText == '') {
          msg = 'Please! enter email address.';
          al.innerText = msg;
      }
      else {
          $('#<%=btnLogin.ClientID%>').click();
      }
  });
});

编辑:

OnClick方法是:

protected void btnLogin_Click(object sender, EventArgs e)
{
  // some code
}

Answer 1

您应该在需要时使用 event.preventDefault() 取消点击事件。

$(document).ready(function () {
  $('#<%=btnLogin.ClientID%>').on('click', function (e) {
      if (email.innerText == '') {
          msg = 'Please! enter email address.';
          al.innerText = msg;
          e.preventDefault();
      }
  });
});

验证成功无需再次调用click。