<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UserVerify.aspx.cs" Inherits="Web.One.UserVerify" %>
<!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>JQuery实战-用户名校验</title>
<link href="../CSS/Css.css" rel="stylesheet" type="text/css" />
<script src="../JavaScript/jquery-1.2.6-intellisense.js" type="text/javascript"></script>
<script src="../JavaScript/JQuery.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
请输入用户名：<input type="text" id="userName" class="userText" /> <input type="button" value="校验" id="verifyButton"/>
<div id="result">
</div>
</form>
</body>
</html>
CheckUser.aspx.cs代码:
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using BLL;
using Model;
namespace Web.One
{
public partial class CheckUser : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string name = Request.QueryString["userName"];
if (name == "")
{
Response.Write("用户名不能为空");
}
//UserManager.getUserByName(name):根据用户名查询该用户是否存在,返回User对象,Name是User的属性
else if (UserManager.getUserByName(name).Name != null)
{
Response.Write("用户["+ name+"]已经注册");
}
else
{
Response.Write("用户["+name+"]可以注册");
}
}
}
}
JQuery.js代码:
/*需要通过javascript代码来做两件事情
*1.button被按下的时候，需要将文本框中的数据获取到，然后发送给服务器端，最后接受服务器返回的数据，填充到我们预留的div中，
这样用到就可以看到结果
*2.文本框上，用户按键之后，需要判断文本框中的内容是否为空，如果不为空，红色的边框和背景图就应该取消，否则保留
**/
/*
*需要在页面装载完成是注册上这些工作
**/
/*
$(document ).ready(function(){
//这里面的内容就是页面装载完成后需要执行的代码
//需要找到button按钮,注册事件
$("#verifyButton").click(function (){
//1.获取文本框的内容
var userName = $("#userName").val(); //val可以获取到文本框中的值
//2.将这个内容发送给服务器端
if(userName == ""){
alert ("用户名不能为空");
}else {
$.get("CheckUser.aspx?userName="+decodeURI(decodeURI(userName)),null,function(response){
//3.接收服务器返回的数据,填充到div中
$("#result").html(response);
});
}
});
//需要找到文本框,注册事件
$("#userName").keyup(function(){
//获取当前文本框中的内容
var value = $(this).val();
if(value == ""){
//让边框变成红色,并且带背景图
$(this).addClass("userText");
}else{
//去掉边框和背景图
$(this).removeClass("userText");
}
});
});
最新评论