|
最近在处理的一个asp.net项目中应用了jquery.validation来进行客户端的验证，感觉挺好的。不过在使用中遇到了一个问题，就是在应用了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=" 确定 " />
|
客服电话
APP下载
官方微信
请发表评论