Ajax初例

最新推荐文章于 2024-07-17 14:13:18 发布

iMarsX

最新推荐文章于 2024-07-17 14:13:18 发布

阅读量57

点赞数

分类专栏： JavaScript 文章标签： html ajax

本文链接：https://blog.csdn.net/kellhan3/article/details/84019327

版权

JavaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

Ajax_user.html

<html>
	<head>
		<title>用户注册</title>
		<meta http-equiv="content-type" content="text/html;charset=gb2312">
		<script language="javascript" type="text/javascript">
		<!--
			//定义用于存储XMLHttpRequest对象的变量
			var xmlHttp = null;
			
			//创建XMLHttpRequest对象
			function creatXMLHTTP()
			{
				//判断浏览器是否支持ActiveX控件
				if(window.ActiveXObject)
				{
					//将所有可能出现的ActiveXObject版本都放在一个数组中
					var arrXmlHttpTypes = ['Microsoft.XMLHTTP','MSXML2.XMLHTTP.6.0',,'MSXML2.XMLHTTP.5.0','MSXML2.XMLHTTP.4.0','MSXML2.XMLHTTP.3.0','MSXML2.XMLHTTP'];
					//通过循环创建XMLHttpRequest对象
					for(var i=0;i<arrXmlHttpTypes.length;i++)
					{
						try
						{
							//创建XMLHttpRequest对象
							xmlHttp = new ActiveXObject(arrXmlHttpTypes[i]);
							//如果创建XMLHttpRequest对象成功，则跳出循环
							break;
						}
						catch(ex)
						{
						}
					}
				}
				//判断浏览器是否将XMLHttpRequest作为本地对象实现
				else if(window.XMLHttpRequest)
				{
					xmlHttp = new XMLHttpRequest();
				}
			}
			
			//响应XMLHttpRequest对象状态变化的函数
			function httpStateChange()
			{
				if (xmlHttp.readyState==4)
				{
					if (xmlHttp.status==200 || xmlHttp.status==0)
					{
						//获得服务器返回的数据
						var userNames = xmlHttp.responseText;
						var arrUserName = userNames.split(";");
						//定义一个变量，用于判断用户名是否已经存在
						var bFlag = false;
						
						for (i=0;i<arrUserName.length;i++)
						{
							if (arrUserName[i]==myForm.myName.value)
							{
								bFlag = true;
								break;
							}
						}
						
						//查找节点
						var node = document.getElementById("myDiv");
						//更新数据
						if (bFlag)
						{
							node.firstChild.nodeValue = "用户名已经存在";
							myForm.submitButton.disabled = true;
						}
						else
						{
							node.firstChild.nodeValue = "用户名不存在，可以使用";
							myForm.submitButton.disabled = false;
						}
					}
				}
			}
			
			//校验用户名是否有效
			function checkName()
			{
				//创建XMLHttpRequest对象
				creatXMLHTTP();
				if (xmlHttp!=null)
				{
					//创建响应XMLHttpRequest对象状态变化的函数
					xmlHttp.onreadystatechange = httpStateChange;
					//创建HTTP请求
					xmlHttp.open("get","Ajax_user.txt",true);
					//发送HTTP请求
					xmlHttp.send(null);
				}
				else
				{
					alert("您的浏览器不支持XMLHTTP，请更换浏览器后再进行注册。");
				}
			}
		-->
		</script>
	</head>
	<body>
		<p align="center"><b>用户注册</b></p>
		<form name="myForm">
			用户名：<input type="text" name="myName" οnblur="checkName()">
			<span id="myDiv">&nbsp;</span><br>
			输入登录密码：<input type="password" name="password1"><br>
			再次输入密码：<input type="password" name="password2"><br>
			密码查询问题：<input type="text" name="problem"><br>
			密码查询答案：<input type="text" name="key"><br>
			<input type="button" value="提交" name="submitButton" disabled>
		</form>
	</body>
</html>

Ajax_user.txt

张三;李四;王五;钱六

iMarsX

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ajax初例

Ajax_user.html&lt;html&gt; &lt;head&gt; &lt;title&gt;用户注册&lt;/title&gt; &lt;meta http-equiv="content-type" content="text/html;charset=gb2312"&gt; &lt;script language="javascr
复制链接

扫一扫