时间:2016-02-15 22:13 来源: 我爱IT技术网 作者:佚名
欢迎您访问我爱IT技术网,今天小编为你分享的编程技术是:【.net采用ajax实现邮箱注册和地区选择实例】,下面是详细的讲解!
.net采用ajax实现邮箱注册和地区选择实例
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" %><!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>ajax的初步练习使用</title>
<style type="text/css">
div{width:800px;margin:0 auto;height:25px;}
</style>
<script type="text/javascript">
function createRequest()//创建对象
{
var request;
try
{
request=new XMLHttpRequest();
}
catch(microspft)
{
try
{
request=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(othermicrosoft)
{
try
{
request=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(failed)
{
request=null;
}
}
}
return request;
}
var req=null;//注册邮箱
function sendRequest()//发送请求
{
if(document.forms[0].useremail.value=="")
{
alert("用户邮箱不可为空!");
document.forms[0].useremail.focus();
return false;
}
req=createRequest();//创建Ajax请求对象
req.open("GET","default.aspx?Email="+document.forms[0].useremail.value);
req.send("");//打开服务器连接,发送请求
req.onreadystatechange=dealMethod;//设置服务器响应完成后要运行的函数
}
function dealMethod()//调用函数
{
if(req.readyState==4&&req.status==200)//此时是服务器已经响应完成状态
{
if(req.responseText=="0")//responseText为服务器响应值属性
document.getElementById("canuse").innerHTML="<img src='http://files.jb51.net/file_images/article/201410/icon_need.gif' />"+"该邮箱已注册";
else
document.getElementById("canuse").innerHTML="<img src='http://files.jb51.net/file_images/article/201410/icon_error.gif'/>"+"该邮箱未注册";
}
}
var req2=null;//初始化下拉框
function GetSelect()
{
req2=createRequest();
req2.open("GET","default.aspx?Selected=1");
req2.send("");
req2.onreadystatechange=changeSelected;
}
function changeSelected()
{
if(req2.readyState==4&&req2.status==200)
{
var s=req2.responseText;
var provinces=s.split('&')[0].split('|');//在后台返回字段中获得省份子列如(1,河南),(2,江西)等
var cities=s.split('&')[1].split('|');//在后台返回字段中获得城市子列如(1,郑州),(2,洛阳),(3,开封)等
document.forms[0].province.length=0;
for(var i=0;i<provinces.length;i++)
{
var op=new Option();
op.value=provinces[i].split(',')[0];
op.text=provinces[i].split(',')[1];
document.forms[0].province.options.add(op);//将省份编号和省份名分别以value和text的形式添加到select下的option里面
}
document.forms[0].city.length=0;
for(var j=0;j<cities.length;j++)
{
var op2=new Option();
op2.value=cities[j].split(',')[0];
op2.text=cities[j].split(',')[1];
document.forms[0].city.options.add(op2);//将城市编号和城市名分别以value和text的形式添加到select下的option里面
}
}
}
var req3=null;//改变省份触动城市的改变
function GetCity()
{
req3=createRequest();
req3.open("GET","default.aspx?ProId="+document.forms[0].province.value);
req3.send("");
req3.onreadystatechange=changeCity;
}
function changeCity()
{
if(req3.readyState==4&&req3.status==200)
{
var s=req3.responseText;
var cities=s.split('|');
document.forms[0].city.length=0;
for(var i=0;i<cities.length;i++)
{
var op=new Option();
op.value=cities[i].split(',')[0];
op.text=cities[i].split(',')[1];
document.forms[0].city.options.add(op);
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table align="center">
<tr>
<th>Email</th>
<th><input type="text" name="useremail" value=""/></th>
<th id="canuse"></th>
<th></th>
</tr>
<tr>
<th><select name="province" onchange="GetCity();"></select></th>
<th><select name="city"></select></th>
<th><input type="button" value="注册" onclick="sendRequest();"/></th>
</tr>
</table>
</form>
</body>
<script type="text/javascript">
GetSelect();
</script>
</html>
关于.net采用ajax实现邮箱注册和地区选择实例的用户互动如下:
相关问题:
答: >>详细
相关问题:
答: >>详细
相关问题:
答: >>详细
- 【asp】asp.net url重写浅谈-net-url重写
- 【DataSet】DataSet、DataTable、DataRow区别详解
- 【创建】ASP.NET Web API教程 创建域模型的方法详
- 【asp】asp.net ubb使用代码-net-ubb使用
- 【默认图片】图片不存在使用默认图片代替的实例
- 【asp】asp.net 页面转向 Response.Redirect Ser
- 【页面打印】关于ASP.NET页面打印技术的常用方法
- 【MVC5】MVC 5 第一章 创建MVC 5 web应用程序-net
- 【MVC】一个简单MVC5 + EF6示例分享-EF6实例-MVC5
- 【服务器】asp.net页面状态管理cookie和服务器状
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
