简单的客户端验证用户名、密码、年龄、日期信息，提交表单时服务器还是要再验证的。
JS代码：
function ajax(url) { xmlhttp = ""; if (window.ActiveXObject) { //判定游览器，不同游览器声明对象不一样。 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { alert("请使用先进的游览器~"); return false; } xmlhttp.open("post", url, false);//提交的数据 xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4) { if (xmlhttp.status == 200) { //提交成功 valuetext = xmlhttp.responseText; //返回数据 } else { alert("请求错误"); return false; } } } xmlhttp.send();//开始发送数据 return valuetext; } function formblur() { var ul = document.getElementById("formul"); var liinput = ul.getElementsByTagName("input"); //获取所有input var img = "
";//验证成功图片地址 for (i = 0; i < liinput.length; i++) { var input = liinput[i]; //判定input类型 if (input.type == "text" || input.type == "password") { input.index = i; input.onblur = function () { var ul = document.getElementById("formul"); var li = ul.getElementsByTagName("li"); //index为遍历所有input的属性。 var span = li[this.index].getElementsByTagName("span");//li元素中的span span[1].style.color = "red"; if (this.value != "") { //用户是否输入内容 span[1].innerHTML = img;//当前span显示图片 var num = this.index; if (num == 0) { //验证用户名是否重复 if (ajax("form.ashx?name=" + this.value) == "success") { span[1].innerHTML = img; } else { span[1].innerHTML = "用户名已存在"; } } else if (num == 1) { //验证密码长度 if (this.value.length >= 6) { span[1].innerHTML = img; } else { span[1].innerHTML = "密码必须大于等于6位数"; } } else if (num == 2) { //验证年龄 if (!isNaN(this.value)) { if (this.value > 0 && this.value < 120) { span[1].innerHTML = img; } else { span[1].innerHTML = "年龄必须大于0"; } } else { span[1].innerHTML = "年龄输入错误"; } } else if (num == 3) { //验证日期，只是简单的判断，没有闰年和月份的具体日分。 var reg = /^[1,2][90]\d{2}-(0[1-9]|1[0-2])-(0[1-9]|[12][0-9]|3[0-1])$/ig; if (reg.test(this.value)) { span[1].innerHTML = img; } else if (input.value != "") { span[1].style.color = "red"; span[1].innerHTML = "出生日期错误或者格式错误,正确格式2012-10-10"; } else { span[1].innerHTML = "请输入正确的信息"; } } else { span[1].innerHTML = "请输入正确的信息"; } } } } } } HTML代码：
form.ashx 验证用户名代码：
public void ProcessRequest(HttpContext context) { string name=context.Request["name"]; if (name != null) { //强类型DateSet if (Convert.ToInt32(new _001TableAdapter().Getname(name).Rows.Count.ToString()) > 0) { context.Response.Write("no"); } else { context.Response.Write("success"); } } }