一、新建数据库，在项目App_Data右击，添加一个数据库，新建一个UserInfo表，表里设UserName，Password两个字段
二、新建一个Default.aspx页面，用表格简单布局，代码如下
<body><form id="form1" runat="server"><table><tr><td>旧密码：</td><td><asp:TextBox ID="txtOldPass" runat="server"></asp:TextBox><asp:RequiredFieldValidatorID="RequiredFieldValidator1" runat="server" ErrorMessage="RequiredFieldValidator"ControlToValidate="txtOldPass">*</asp:RequiredFieldValidator><span id="msg"></span></td></tr><tr><td>新密码：</td><td><asp:TextBox ID="txtNewPass" runat="server"></asp:TextBox><asp:RequiredFieldValidatorID="RequiredFieldValidator2" runat="server" ErrorMessage="RequiredFieldValidator"ControlToValidate="txtNewPass">*</asp:RequiredFieldValidator></td></tr><tr><td>确认新密码：</td><td><asp:TextBox ID="txtConfirmPass" runat="server"></asp:TextBox><asp:RequiredFieldValidatorID="RequiredFieldValidator3" runat="server" ErrorMessage="RequiredFieldValidator"Display="Dynamic" ControlToValidate="txtConfirmPass">*</asp:RequiredFieldValidator><asp:CompareValidatorID="CompareValidator1" runat="server" ErrorMessage="CompareValidator" ControlToCompare="txtNewPass"ControlToValidate="txtConfirmPass">两次密码不一致</asp:CompareValidator></td></tr><tr><td colspan="2" align="center"><asp:Button ID="btnModify" runat="server" Text="修改" /></td></tr></table></form></body>
三、新建一个WebService，名为：CheckPassword.asmx，注意将 [System.Web.Script.Services.ScriptService]这个取消注释
代码如下：
/// <summary>/// CheckPassword 的摘要说明/// </summary>[WebService(Namespace = "/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][ponentModel.ToolboxItem(false)]// 若要允许使用 AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。[System.Web.Script.Services.ScriptService]public class CheckPassword : System.Web.Services.WebService{[WebMethod]public string IsCorrectPass(string username, string password){string connStr = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;string word = "";using (SqlConnection conn = new SqlConnection(connStr)){using (SqlCommand cmd = new SqlCommand(string.Format("select password from UserInfo where UserName='{0}'", username), conn)){conn.Open();word = cmd.ExecuteScalar().ToString();if (word == password){return "密码正确";}else{return "密码错误";}}}}}
四、Default.aspx页面里加入以下JS代码
<script type="text/javascript">$(function() {$("#<%=txtOldPass.ClientID %>").blur(function() {$.ajax({type: "POST",contentType: "application/json",url: "CheckPassword.asmx/IsCorrectPass",data: "{username:'admin',password:'" + $(this).val() + "'}",//这里为了方便用户名就只有一个，dataType: "json", //数据库里也就一条数据success: function(result) {$("#msg").text(result.d);}}); });});</script>
其实很简单，就是练习JQuery AJAX，作为刚刚学习JQuery的我，就当是练笔吧。
五、最后的运行效果为
作为练习没有实现加密，密码也直接显示出来了。当输入正确的密码，然后光标离开文本框就立即判断密码输入是否正确。
源代码下载地址：
