javascript ajax

原创

mb64660286caedc 2023-05-19 00:01:11 博主文章分类：javascript ©著作权

文章标签 javascript ViewUI xml html 文章分类 Html/CSS 前端开发

©著作权归作者所有：来自51CTO博客作者mb64660286caedc的原创作品，请联系作者获取转载授权，否则将追究法律责任

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>XMLHttpRequest</title>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function startRequest(){
	createXMLHttpRequest();
	xmlHttp.open("GET","9-1.aspx",true);
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
			alert("服务器返回: " + xmlHttp.responseText);
	}
	xmlHttp.send(null);
}
</script>
</head>
<body>
<input type="button" value="测试异步通讯" onClick="startRequest()">
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	Response.Write("异步测试成功，很高兴");
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>XMLHttpRequest</title>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function startRequest(){
	createXMLHttpRequest();
	var sUrl = "9-1.aspx?" + new Date().getTime();	//地址不断的变化
	xmlHttp.open("GET",sUrl,true);
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
			alert("服务器返回: " + xmlHttp.responseText);
	}
	xmlHttp.send(null);
}
</script>
</head>
<body>
<input type="button" value="测试异步通讯" onClick="startRequest()">
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>GET VS. POST</title>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function createQueryString(){
	var firstName = document.getElementById("firstName").value;
	var birthday = document.getElementById("birthday").value;	
	var queryString = "firstName=" + firstName + "&birthday=" + birthday;
	return encodeURI(encodeURI(queryString));	//两次编码解决中文乱码问题
}
function doRequestUsingGET(){
	createXMLHttpRequest();
	var queryString = "9-3.aspx?";
	queryString += createQueryString() + "×tamp=" + new Date().getTime();
	xmlHttp.onreadystatechange = handleStateChange;
	xmlHttp.open("GET",queryString);
	xmlHttp.send(null);
}
function doRequestUsingPOST(){
	createXMLHttpRequest();
	var url = "9-3.aspx?timestamp=" + new Date().getTime();
	var queryString = createQueryString();
	xmlHttp.open("POST",url);
	xmlHttp.onreadystatechange = handleStateChange;
	xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	xmlHttp.send(queryString);
}
function handleStateChange(){
	if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
		var responseDiv = document.getElementById("serverResponse");
		responseDiv.innerHTML = decodeURI(xmlHttp.responseText);	//解码
	}
}
</script>
</head>

<body>
<h2>输入姓名和生日</h2>
<form>
	<input type="text" id="firstName" /><br>
	<input type="text" id="birthday" />
</form>
<form>
	<input type="button" value="GET" onclick="doRequestUsingGET();" /><br>
	<input type="button" value="POST" onclick="doRequestUsingPOST();" />
</form>
<div id="serverResponse"></div>
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	if(Request.HttpMethod == "POST")
		Response.Write("POST: " + Request["firstName"] + ", your birthday is " + Request["birthday"]);
	else if(Request.HttpMethod == "GET")
		Response.Write("GET: " + Request["firstName"] + ", your birthday is " + Request["birthday"]);
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>responseXML</title>
<style>
<!--
.datalist{
	border:1px solid #744011;	/* 表格边框 */
	font-family:Arial;
	border-collapse:collapse;	/* 边框重叠 */
	background-color:#ffd2aa;	/* 表格背景色 */
	font-size:14px;
}
.datalist th{
	border:1px solid #744011;	/* 行名称边框 */
	background-color:#a16128;	/* 行名称背景色 */
	color:#FFFFFF;				/* 行名称颜色 */
	font-weight:bold;
	padding-top:4px; padding-bottom:4px;
	padding-left:12px; padding-right:12px;
	text-align:center;
}
.datalist td{
	border:1px solid #744011;	/* 单元格边框 */
	text-align:left;
	padding-top:4px; padding-bottom:4px;
	padding-left:10px; padding-right:10px;
}
.datalist tr:hover, .datalist tr.altrow{
	background-color:#dca06b;	/* 动态变色 */
}
input{	/* 按钮的样式 */
	border:1px solid #744011;
	color:#744011;
}
-->
</style>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function getXML(addressXML){
	var url = addressXML + "?timestamp=" + new Date();
	createXMLHttpRequest();
	xmlHttp.onreadystatechange = handleStateChange;
	xmlHttp.open("GET",url);
	xmlHttp.send(null);
}
function addTableRow(sName, sClass, sBirth, sConstell, sMobile){
	//表格添加一行的相关操作，可参看7.2.1节
	var oTable = document.getElementById("member");
	var oTr = oTable.insertRow(oTable.rows.length);	
	var aText = new Array();
	aText[0] = document.createTextNode(sName);
	aText[1] = document.createTextNode(sClass);
	aText[2] = document.createTextNode(sBirth);
	aText[3] = document.createTextNode(sConstell);
	aText[4] = document.createTextNode(sMobile);
	for(var i=0;i<aText.length;i++){
		var oTd = oTr.insertCell(i);
		oTd.appendChild(aText[i]);
	}
}
function DrawTable(myXML){
	//用DOM方法操作XML文档
	var oMembers = myXML.getElementsByTagName("member");
	var oMember = "", sName = "", sClass = "", sBirth = "", sConstell = "", sMobile = "";
	for(var i=0;i<oMembers.length;i++){
		oMember = oMembers[i];
		sName = oMember.getElementsByTagName("name")[0].firstChild.nodeValue;
		sClass = oMember.getElementsByTagName("class")[0].firstChild.nodeValue;
		sBirth = oMember.getElementsByTagName("birth")[0].firstChild.nodeValue;
		sConstell = oMember.getElementsByTagName("constell")[0].firstChild.nodeValue;
		sMobile = oMember.getElementsByTagName("mobile")[0].firstChild.nodeValue;
		//添加一行
		addTableRow(sName, sClass, sBirth, sConstell, sMobile);
	}
}
function handleStateChange(){	
	if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
		DrawTable(xmlHttp.responseXML);	//responseXML获取到XML文档
}
</script>
</head>

<body>
<input type="button" value="获取XML" onclick="getXML('9-4.xml');"><br><br>
<table class="datalist" summary="list of members in EE Studay" id="member">
	<tr>
		<th scope="col">Name</th>
		<th scope="col">Class</th>
		<th scope="col">Birthday</th>
		<th scope="col">Constellation</th>
		<th scope="col">Mobile</th>
	</tr>
</table>
</body>
</html>

<?xml version="1.0" encoding="gb2312"?>
<list>
	<caption>Member List</caption>
	<member>
		<name>isaac</name>
		<class>W13</class>
		<birth>Jun 24th</birth>
		<constell>Cancer</constell>
		<mobile>1118159</mobile>
	</member>
	<member>
		<name>fresheggs</name>
		<class>W610</class>
		<birth>Nov 5th</birth>
		<constell>Scorpio</constell>
		<mobile>1038818</mobile>
	</member>
	<member>
		<name>girlwing</name>
		<class>W210</class>
		<birth>Sep 16th</birth>
		<constell>Virgo</constell>
		<mobile>1307994</mobile>
	</member>
	<member>
		<name>tastestory</name>
		<class>W15</class>
		<birth>Nov 29th</birth>
		<constell>Sagittarius</constell>
		<mobile>1095245</mobile>
	</member>
	<member>
		<name>lovehate</name>
		<class>W47</class>
		<birth>Sep 5th</birth>
		<constell>Virgo</constell>
		<mobile>6098017</mobile>
	</member>
	<member>
		<name>slepox</name>
		<class>W19</class>
		<birth>Nov 18th</birth>
		<constell>Scorpio</constell>
		<mobile>0658635</mobile>
	</member>
	<member>
		<name>smartlau</name>
		<class>W19</class>
		<birth>Dec 30th</birth>
		<constell>Capricorn</constell>
		<mobile>0006621</mobile>
	</member>
	<member>
		<name>tuonene</name>
		<class>W210</class>
		<birth>Nov 26th</birth>
		<constell>Sagittarius</constell>
		<mobile>0091704</mobile>
	</member>
	<member>
		<name>dovecho</name>
		<class>W19</class>
		<birth>Dec 9th</birth>
		<constell>Sagittarius</constell>
		<mobile>1892013</mobile>
	</member>
	<member>
		<name>shanghen</name>
		<class>W42</class>
		<birth>May 24th</birth>
		<constell>Gemini</constell>
		<mobile>1544254</mobile>
	</member>
	<member>
		<name>venessawj</name>
		<class>W45</class>
		<birth>Apr 1st</birth>
		<constell>Aries</constell>
		<mobile>1523753</mobile>
	</member>
	<member>
		<name>lightyear</name>
		<class>W311</class>
		<birth>Mar 23th</birth>
		<constell>Aries</constell>
		<mobile>1002908</mobile>
	</member>
</list>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>多个异步对象</title>
<script language="javascript">
var xmlHttp;	//全局变量	
function createQueryString(oText){
	var sInput = document.getElementById(oText).value;
	var queryString = "oText=" + sInput;
	return queryString;
}
function getData(oServer, oText, oSpan){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
	var queryString = oServer + "?";
	queryString += createQueryString(oText) + "×tamp=" + new Date().getTime();
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
			var responseSpan = document.getElementById(oSpan);
			responseSpan.innerHTML = xmlHttp.responseText;
		}
	}
	xmlHttp.open("GET",queryString);
	xmlHttp.send(null);
}
function test(){
	//同时发送两个不同的异步请求
	getData('9-5.aspx','first','firstSpan');
	getData('9-5.aspx','second','secondSpan');
}
</script>
</head>

<body>
<form>
	first: <input type="text" id="first">
	<span id="firstSpan"></span>
<br>
	second: <input type="text" id="second">
	<span id="secondSpan"></span>
<br>
	<input type="button" value="发送" onclick="test()">
</form>
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	Response.Write(Request["oText"]);
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>多个异步对象</title>
<script language="javascript">	
function createQueryString(oText){
	var sInput = document.getElementById(oText).value;
	var queryString = "oText=" + sInput;
	return queryString;
}
function getData(oServer, oText, oSpan){
	var xmlHttp;	//处理为局部变量
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
	var queryString = oServer + "?";
	queryString += createQueryString(oText) + "×tamp=" + new Date().getTime();
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
			var responseSpan = document.getElementById(oSpan);
			responseSpan.innerHTML = xmlHttp.responseText;
			delete xmlHttp;		//收到返回结构后手动删除
			xmlHttp = null;
		}
	}
	xmlHttp.open("GET",queryString);
	xmlHttp.send(null);
}
function test(){
	//同时发送两个不同的异步请求
	getData('9-5.aspx','first','firstSpan');
	getData('9-5.aspx','second','secondSpan');
}
</script>
</head>

<body>
<form>
	first: <input type="text" id="first">
	<span id="firstSpan"></span>
<br>
	second: <input type="text" id="second">
	<span id="secondSpan"></span>
<br>
	<input type="button" value="发送" onclick="test()">
</form>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>ajaxlib</title>
<script language="javascript" src="ajaxlib.js"></script>
<script language="javascript">
function decodeXML(){
	var oTemp = resultXML.getElementsByTagName("temp");
	document.getElementById("targetID").innerHTML = oTemp[0].firstChild.nodeValue;
}
</script>
</head>

<body>
<h3>Testing ajaxlib</h3>
<form>
	<input type="button" value="display" onclick="loadXMLDoc('9-7.aspx',decodeXML,false);">
</form>
<div id="targetID">the fetched data will go here</div>
</body>
</html>

<%@ Page Language="C#" ContentType="text/xml" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	Response.ContentType = "text/xml";
	Response.CacheControl = "no-cache";
	Response.AddHeader("Pragma","no-cache");

	string xml = "<temp>test</temp>";
	Response.Write(xml);
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>test</title>
<script language="javascript" src="ajaxgold.js"></script>
<script language="javascript">
function display(text){
	document.getElementById("targetID").innerHTML = text;
}
</script>
</head>

<body>
<form>
	<input type="button" value="get the message" onclick="postDataReturnText('9-8.aspx','a=2&b=3',display);">
</form>
<div id="targetID">The fetch data will go here</div>
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.OleDb" %>
<%@ Import Namespace="System.IO" %>
<%
	Response.ContentType = "text/xml";
	Response.CacheControl = "no-cache";
	Response.AddHeader("Pragma","no-cache");

	int a = int.Parse(Request["a"]);
	int b = int.Parse(Request["b"]);
	Response.Write(a+b);
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>自动校验的表单</title>
<style type="text/css">
<!--
form{
	padding:0px; margin:0px;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}
input{
	border:1px solid #004082;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}
-->
</style>
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function showResult(sText){
	var oSpan = document.getElementById("UserResult");
	oSpan.innerHTML = sText;
	if(sText.indexOf("already exists") >= 0)
		//如果用户名已被占用
		oSpan.style.color = "red";
	else
		oSpan.style.color = "black";
}
function startCheck(oInput){
	//首先判断是否有输入，没有输入直接返回，并提示
	if(!oInput.value){
		oInput.focus();		//聚焦到用户名的输入框
		document.getElementById("UserResult").innerHTML = "User cannot be empty.";
		return;
	}
	//创建异步请求
	createXMLHttpRequest();
	var sUrl = "9-9.aspx?user=" + oInput.value.toLowerCase() + "×tamp=" + new Date().getTime();
	xmlHttp.open("GET",sUrl,true);
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
			showResult(xmlHttp.responseText);	//显示服务器结果
	}
	xmlHttp.send(null);
}
</script>
</head>
<body>
<form name="register">
<table cellpadding="5" cellspacing="0" border="0">
	<tr><td>用户名:</td><td><input type="text" onblur="startCheck(this)" name="User"></td> <td><span id="UserResult"></span></td> </tr>
	<tr><td>输入密码:</td><td><input type="password" name="passwd1"></td> <td></td> </tr>
    <tr><td>确认密码:</td><td><input type="password" name="passwd2"></td> <td></td> </tr>
	<tr>
		<td colspan="2" align="center">
		<input type="submit" value="注册">
        <input type="reset" value="重置">
		</td> <td></td>
	</tr>
</table>
</form>
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	Response.CacheControl = "no-cache";
	Response.AddHeader("Pragma","no-cache");

	if(Request["user"]=="isaac")
		Response.Write("Sorry, " + Request["user"] + " already exists.");
	else
		Response.Write(Request["user"]+" is ok.");
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Ajax实现自动提示的文本框</title>
<style>
<!--
body{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px; padding:0px; margin:5px;
}
form{padding:0px; margin:0px;}
input{
	/* 用户输入框的样式 */
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px; border:1px solid #000000;
	width:200px; padding:1px; margin:0px;
}
#popup{
	/* 提示框div块的样式 */
	position:absolute; width:202px;
	color:#004a7e; font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	left:41px; top:25px;
}
#popup.show{
	/* 显示提示框的边框 */	
	border:1px solid #004a7e;
}
#popup.hide{
	/* 隐藏提示框的边框 */
	border:none;
}
/* 提示框的样式风格 */
ul{
	list-style:none;
	margin:0px; padding:0px;
}
li.mouseOver{
	background-color:#004a7e;
	color:#FFFFFF;
}
li.mouseOut{
	background-color:#FFFFFF;
	color:#004a7e;
}
-->
</style>
<script language="javascript">
var oInputField;	//考虑到很多函数中都要使用
var oPopDiv;		//因此采用全局变量的形式
var oColorsUl;
var xmlHttp;
function createXMLHttpRequest(){
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
}
function initVars(){
	//初始化变量
	oInputField = document.forms["myForm1"].colors;
	oPopDiv = document.getElementById("popup");
	oColorsUl = document.getElementById("colors_ul");
}
function clearColors(){
	//清除提示内容
	for(var i=oColorsUl.childNodes.length-1;i>=0;i--)
		oColorsUl.removeChild(oColorsUl.childNodes[i]);
	oPopDiv.className = "hide";
}
function setColors(the_colors){
	//显示提示框，传入的参数即为匹配出来的结果组成的数组
	clearColors();	//每输入一个字母就先清除原先的提示，再继续
	oPopDiv.className = "show";
	var oLi;
	for(var i=0;i<the_colors.length;i++){
		//将匹配的提示结果逐一显示给用户
		oLi = document.createElement("li");
		oColorsUl.appendChild(oLi);
		oLi.appendChild(document.createTextNode(the_colors[i]));

		oLi.onmouseover = function(){
			this.className = "mouseOver";	//鼠标经过时高亮
		}
		oLi.onmouseout = function(){
			this.className = "mouseOut";	//离开时恢复原样
		}
		oLi.onclick = function(){
			//用户点击某个匹配项时，设置输入框为该项的值
			oInputField.value = this.firstChild.nodeValue;
			clearColors();	//同时清除提示框
		}
	}
}
function findColors(){
	initVars();		//初始化变量
	if(oInputField.value.length > 0){
		createXMLHttpRequest();		//将用户输入发送给服务器
		var sUrl = "9-10.aspx?sColor=" + oInputField.value + "×tamp=" + new Date().getTime();
		xmlHttp.open("GET",sUrl,true);
		xmlHttp.onreadystatechange = function(){
			if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
				var aResult = new Array();
				if(xmlHttp.responseText.length){
					aResult = xmlHttp.responseText.split(",");
					setColors(aResult);	//显示服务器结果
				}
				else
					clearColors();
			}
		}
		xmlHttp.send(null);
	}		
	else
		clearColors();	//无输入时清除提示框（例如用户按del键）
}
</script>
</head>
<body>
<form method="post" name="myForm1">
Color: <input type="text" name="colors" id="colors" onkeyup="findColors();" />
</form>
<div id="popup">
	<ul id="colors_ul"></ul>
</div>
</body>
</html>

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<%@ Import Namespace="System.Data" %>
<%
	Response.CacheControl = "no-cache";
	Response.AddHeader("Pragma","no-cache");
	string sInput = Request["sColor"].Trim();
	if(sInput.Length == 0)
		return;
	string sResult = "";

	string[] aColors = new string[]{"aliceblue","antiquewith","aquamarine","azure","beige","bisque","black","blanchedalmond","blue","blueviolet","brass","bronze","brown","burlywood","cadetblue","chartreuse","chocolate","copper","coral","cornfloewrblue","cornsilk","cyan","darkblue","darkcyan","darkgoldenrod","darkgray","darkgreen","darkhaki","darkmagenta","darkolivegreen","darkorchid","darkorenge","darkred","darksalmon","darkseagreen","darkslateblue","darkslategray","darkturquoise","darkviolet","deeppink","deepskyblue","dimgray","dodgerblue","feldspar","firebrick","floralwhite","forestgreen","fuchsia","gainsboro","gold","goldenrod","golenrod","gostwhite","gray","green","greenyellow","honeydew","hotpink","indianred","inen","ivory","khaki","lavender","lavenderblush","lawngreen","lemonchiffon","lightblue","lightcoral","lightcyan","lightgodenrod","lightgodenrodyellow","lightgray","lightgreen","lightpink","lightsalmon","lightseagreen","lightskyblue","lightslateblue","lightslategray","lightsteelblue","lightyellow","lime","limegreen","magenta","magenta","maroom","maroon","mediumaquamarine","mediumblue","mediumorchid","mediumpurpul","mediumseagreen","mediumslateblue","mediumspringgreen","mediumturquoise","mediumvioletred","midnightblue","mintcream","mistyrose","moccasin","navajowhite","navy","navyblue","oldlace","olivedrab","orange","orchid","orengered","palegodenrod","palegreen","paleturquoise","palevioletred","papayawhip","peachpuff","peru","pink","plum","powderblue","purple","quartz","red","rosybrown","royalblue","saddlebrown","salmon","sandybrown","scarlet","seagreen","seashell","sienna","silver","skyblue","slategray","snow","springgreen","steelblue","tan","thistle","tomato","turquoise","violet","violetred","wheat","whitesmoke","yellow","yellowgreen"};

	for(int i=0;i<aColors.Length;i++){
		if(aColors[i].IndexOf(sInput) == 0)
			sResult += aColors[i] + ",";
	}
	if(sResult.Length>0)									//如果有匹配项
		sResult = sResult.Substring(0,sResult.Length-1);	//去掉最后的“,”号
	Response.Write(sResult);
%>