在ASP.NET中应用了jquery.validation后导致asp.net的按钮无法触发事件,页面代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ChangePassword.aspx.cs" Inherits="Individuation_ChangePassword" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>密码修改</title> <script type="text/javascript" src="../JS/jquery.js"></script> <script type="text/javascript" src="../JS/jquery.validate.pack.js"></script> <script type="text/javascript" src="../JS/cmxforms.js"></script> <link href="../CSS/screen.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $.validator.setDefaults({ submitHandler: function(form) { form.submit(); } }); $().ready(function() { // validate signup form on keyup and submit$("#form1").validate({ rules: { txtOldPassword: "required", txtNewPassword: "required", txtConfirmPassword: "required", txtOldPassword: { required: true }, txtNewPassword: { required: true, minlength: 3 }, txtConfirmPassword: { required: true, minlength: 3, equalTo: "#txtNewPassword" } }, messages: { txtOldPassword: { required: "请输入原密码!" }, txtNewPassword: { required: "请输入新密码!", minlength: "新密码长度不能小于为3位!" }, txtConfirmPassword: { required: "请确认新密码!", minlength: "新密码长度不能小于为3位!", equalTo: "两次输入的密码不一致!" } } }); }); </script> <style type="text/css"> </style> </head> <body> <div id="main"> <form class="cmxform" id="form1" runat="server" > <fieldset> <legend>密码修改</legend> <p> <label for="txtOldPassword">原密码</label> <asp:TextBox ID="txtOldPassword" runat="server" MaxLength="15" TextMode="Password"></asp:TextBox> </p> <p> <label for="txtNewPassword">输入新密码</label> <asp:TextBox ID="txtNewPassword" runat="server" MaxLength="15" TextMode="Password" ></asp:TextBox> </p> <p> <label for="txtConfirmPassword">确认新密码</label> <asp:TextBox ID="txtConfirmPassword" runat="server" MaxLength="15" TextMode="Password" ></asp:TextBox> </p> <p> <asp:Button ID="btnSubmit" class="btn3_mouseout" onmouseover="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'" onmousedown="this.className='btn3_mousedown'" onmouseup="this.className='btn3_mouseup'" title="提交" runat="server" Text="提交" onclick="btnSubmit_Click" /> <input type="button" id="btnCancel" value="取消" class="btn3_mouseout" onmouseover="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'" onmousedown="this.className='btn3_mousedown'" onmouseup="this.className='btn3_mouseup'" /> </p> </fieldset> </form> </div> </body> </html>
经过分析得出原因:
经过一番折腾后,通过在页面上加入了下面的一行代码,解决问题,但对原理还不是太清楚
<input type="hidden" name="btnSubmit" value=" 确定 " />
如果真要设置submitHandler属性,那应当这样来设:submitHandler:__doPostBack(<% =btnSubmit.ClientID %>),服务器控件要想触发事件,就必须为Form里名为__EVENTTARGET的Hidden设置正确的控件ID,可以看看页面生成的HTML就明白了。
转载自:http://zhangronghua.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。