如果JavaScript验证失败，则防止回发页面

Question

我关注的是asp 文本框 ：

<asp:TextBox ID="txtPasswrod" runat="server"></asp:TextBox>

在此文本框下面，我有错误消息标签 ，该标签 最初是隐藏的，直到文本框的js验证 失败为止：

<label id="errorMsg" for="pwd" style="display:none">error</label >

以下是用于文本框验证的js ：

function validation() 
{
  var pwd = document.getElementById("txtPasswrod").value;
  if (pwd == null || pwd == "") 
  {
    document.getElementById("error").style.display = 'block';
    return false;
  }
}

以下是ASP的按钮 ，它的OnClientClick事件我打电话验证（）函数：

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="validation()"/>

验证工作正常 ，但是问题是，当文本框为空并且我的验证失败时 ， js应该阻止页面回发 ，但是允许页面回发的js和我的验证jst变得无用 。

请告诉我如何防止未通过js验证的页面回发 。

Answer 1

修改validation()以return validation() ，如果function返回false ，这将停止页面发布。

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="return validation();"/>

Answer 2

您需要在JS脚本中稍作更改。 您需要添加.ClientID因为您指定的控件是服务器控件。 或者，如果您使用的是.net 4.0，则可以使用ClientIDMode= "Static"来访问代码中所使用的控件。

function validation() {
                var pwd = document.getElementById('<%=txtPasswrod.ClientID').value;
                if (pwd == null || pwd == "") 
                {
                    document.getElementById("errorMsg").style.display = 'block';
                    return false;
                }
            }

现在调用验证方法，如下所示：

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="return validation();"/>