1

在我的 login.aspx 中，我试图在单击按钮时执行简单的客户端验证（检查用户名和密码字段是否为空）。但是 jquery 中的 .click() 没有触发。我哪里错了。

注意：我有一个事件 LoginButton_Click 背后有一些功能的代码。

<script src="Scripts/Login.js" type="text/javascript"></script>

 <td align="right" colspan="2">
     <asp:Button ID="LoginButton" runat="server"  Text="Log In" 
       onclick="LoginButton_Click" class ="validateForm" />
</td>

我的 login.js 文件：

$(function () {

  $('#LoginButton').click(function () {

            var username = $('#txtUserName');
            var pwd = $('#txtPassword');
            if (username.val().length <= 0) {
                alert("User Name is required.");
                return false;
            }
            if (pwd.val().length <= 0) {
                alert("Password is required.");
                return false;
            }

        });
});

提前致谢

BB

4

5 回答 5

4

$("#<%= LoginButton.ClientID %>")不适用于外部 JavaScript 文件。如果要使用外部文件，请在 aspx 文件中创建一个全局变量并在 JavaScript 文件中访问它。

编辑：

在 aspx 文件中创建全局变量。

var loginButtonId = <%= LoginButton.ClientID %>;

在 JavaScript 文件中使用它

$("#" + loginButtonId ).click(function () {...});

注意：变量应该在添加对 JavaScript 文件的引用之前声明。

于 2011-10-14T19:28:02.327 回答
2

这应该不会给您带来任何问题，使用 jquery 选择器，我们通过其以 LoginButton 结尾的 id 属性来选择它。

$(function () {
  $("input[id$=LoginButton]").click(function () {

            var username = $("input[id$=txtUserName]");
            var pwd = $("input[id$=txtPassword]");
            if (username.val().length <= 0) {
                alert("User Name is required.");
                return false;
            }
            if (pwd.val().length <= 0) {
                alert("Password is required.");
                return false;
            }

        });
});
于 2011-10-14T19:38:29.453 回答
1

我想你想要onclientclick。

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick.aspx

以防万一有人在乎...

<script src="Scripts/Login.js" type="text/javascript"></script>

 <td align="right" colspan="2">
     <asp:Button ID="LoginButton" runat="server"  Text="Log In" 
       onclick="LoginButton_Click" onclientclick="validateLogin()" class ="validateForm" />
</td>

login.js 文件：

function validateLogin() {

            var username = $('#txtUserName');
            var pwd = $('#txtPassword');
            if (username.val().length <= 0) {
                alert("User Name is required.");
                return false;
            }
            if (pwd.val().length <= 0) {
                alert("Password is required.");
                return false;
            }

            return true;
}
于 2011-10-14T19:27:17.580 回答
1

因为在您的 .js 文件中，javascript 无法读取此值：$("#<%= LoginButton.ClientID %>")
您需要： - 将此代码放在 html 页面的末尾。
或者
- 在 js 文件中放置一个固定的选择器

于 2011-10-14T19:29:09.093 回答
1

#LoginButton不存在。当 asp 按钮被呈现时，它将被呈现为与包含它的 ASP 控件相关的专用 ID，例如ctrl00_mycontrol_panelid_LoginButton. 为了将其引入外部文件，您需要做的是使用全局变量：

var loginButtonID;
var txtUserNameID;
var txtPasswordID;

$(function () {

  $(loginButtonID).click(function () {

            var username = $(txtUserNameID);
            var pwd = $(txtPasswordID);
            if (username.val().length <= 0) {
                alert("User Name is required.");
                return false;
            }
            if (pwd.val().length <= 0) {
                alert("Password is required.");
                return false;
            }

        });
});

然后在包含此 login.js 文件的文件中，您需要通过调用设置这些变量：

<script type="text/javascript">

loginButtonID = '<%=LoginButton.ClientID%>';
txtUserNameID = '<%=txtUserName.ClientID%>';
txtPasswordID = '<%=txtPassword.ClientID%>';

</script>

确保不要用新的“var”修饰符重新声明这些。这可能会破坏范围并搞砸你的脚本。

于 2011-10-14T19:56:33.460 回答