[1].[代码] [C#]代码 跳至 [1] [2] [3] [4]
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
|
<!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>
|
[2].[代码] [C#]代码 跳至 [1] [2] [3] [4]
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<%@ 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);
%>
|
[3].[代码] [C#]代码 跳至 [1] [2] [3] [4]
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
|
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<html>
<head>
<title>jQuery实现自动提示的文本框</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;
}
/* 提示框的样式风格 */
ul{
list-style:none;
margin:0px; padding:0px;
color:#004a7e;
}
li.mouseOver{
background-color:#004a7e;
color:#FFFFFF;
}
-->
</style>
<script language=
"javascript"
src=
"jquery.min.js"
></script>
<script language=
"javascript"
>
var
oInputField;
//考虑到很多函数中都要使用
var
oPopDiv;
//因此采用全局变量的形式
var
oColorsUl;
function initVars(){
//初始化变量
oInputField = $(
"#colors"
);
oPopDiv = $(
"#popup"
);
oColorsUl = $(
"#colors_ul"
);
}
function clearColors(){
//清除提示内容
oColorsUl.empty();
oPopDiv.removeClass(
"show"
);
}
function setColors(the_colors){
//显示提示框，传入的参数即为匹配出来的结果组成的数组
clearColors();
//每输入一个字母就先清除原先的提示，再继续
oPopDiv.addClass(
"show"
);
for
(
var
i=0;i<the_colors.length;i++)
//将匹配的提示结果逐一显示给用户
oColorsUl.append($(
"<li>"
+the_colors[i]+
"</li>"
));
oColorsUl.find(
"li"
).click(function(){
oInputField.val($(
this
).text());
clearColors();
}).hover(
function(){$(
this
).addClass(
"mouseOver"
);},
function(){$(
this
).removeClass(
"mouseOver"
);}
);
}
function findColors(){
initVars();
//初始化变量
if
(oInputField.val().length > 0){
//获取异步数据
$.
get
(
"14-10.aspx"
,{sColor:oInputField.val()},
function(data){
var
aResult =
new
Array();
if
(data.length > 0){
aResult = data.split(
","
);
setColors(aResult);
//显示服务器结果
}
else
clearColors();
});
}
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>
|
[4].[代码] [C#]代码 跳至 [1] [2] [3] [4]
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<%@ 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);
%>
参考网址：http://www.oschina.net/code/snippet_119226_6201
|
6488
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
