社区
ASP
帖子详情
文本框中输入搜索内容自动显示匹配信息
gyl086
2008-02-22 10:33:13
楼里的各位新年好啊,现在我有个问题请教大家,我在asp页面上想实现如下的功能:
姓名<input type="text" name="xm">
我想在上面的文本框里输入姓名的时候能显示数据库中已经有的名字.应该怎么做啊?谢谢了啊.....在线等奥
...全文
1933
13
打赏
收藏
文本框中输入搜索内容自动显示匹配信息
楼里的各位新年好啊,现在我有个问题请教大家,我在asp页面上想实现如下的功能: 姓名 我想在上面的文本框里输入姓名的时候能显示数据库中已经有的名字.应该怎么做啊?谢谢了啊.....在线等奥
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
13 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
gyl086
2008-02-25
打赏
举报
回复
chinmo 你好,不好意思,您说的红色部分怎么该成数据库里的数据呢?比如:数据库aa,表a1(user_name,user_sex),ip本地.
一天到晚游泳的鱼2016
2008-02-25
打赏
举报
回复
其实就是模仿google suggest 下拉菜单
http://blog.csdn.net/sandyxxx/archive/2008/02/03/2079690.aspx
这里有源代码,你看看吧。
一把编程的菜刀
2008-02-25
打赏
举报
回复
给你一个例子
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
body,div {
font-family:verdana;
line-height:100%;
font-size:9pt;
}
input {
width:300px;
}
h1 {
text-align:center;
font-size:2.2em;
}
#divf {
margin:10px;
font-size:0.8em;
text-align:center;
}
#divc {
border:1px solid #333333;
}
.des {
width:500px;
background-color:lightyellow;
border:1px solid #333;
padding:20px;
margin-top:20px;
}
.mouseover {
color:#ffffff;
background-color:highlight;
cursor:default;
}
.mouseout {
color:#000000;
background-color:#ffffff;
cursor:default;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function jsAuto(instaceName,objID)
{
this._msg = [];
this._o = document.getElementById( objID );
if (!this._o) return;
this._f = null;
this._i = instaceName;
this._r = null;
this._v = null;
this._o.style.visibility = "hidden";
this._o.style.lineHeight = "120%";
this._o.style.position = "absolute";
this._o.style.zIndex = "9999";
return this;
};
// mouseEvent.
jsAuto.prototype.domouseover=function(obj)
{
obj.tagName=="DIV" ? obj.className="mouseover" : obj.parentElement.className="mouseover";
};
jsAuto.prototype.domouseout=function(obj)
{
obj.tagName=="DIV" ? obj.className="mouseout" : obj.parentElement.className="mouseout";
};
jsAuto.prototype.doclick=function(msg) { with (this)
{
if(_r)
{
_r.value = msg;
_o.style.visibility = "hidden";
}
else
{
alert("javascript autocomplete ERROR :\n\n can not get return object.");
return;
}
}};
// object method;
jsAuto.prototype.item=function(msg)
{
if( msg.indexOf(",")>0 )
{
var arrMsg=msg.split(",");
for(var i=0; i<arrMsg.length; i++)
{
arrMsg[i] ? this._msg.push(arrMsg[i]) : "";
}
}
else
{
this._msg.push(msg);
}
this._msg.sort();
};
jsAuto.prototype.append=function(msg) { with (this)
{
_i ? "" : _i = eval(_i);
var div = document.createElement("DIV");
//bind event to object.
div.onmouseover = function(){_i.domouseover(this)};
div.onmouseout = function(){_i.domouseout(this)};
div.onclick = function(){_i.doclick(msg)};
var re = new RegExp("(" + _v + ")","i");
div.className = "mouseout";
if (_v) div.innerHTML = msg.replace(re , "<strong>$1</strong>");
div.style.fontFamily = "verdana";
_o.appendChild(div);
}};
jsAuto.prototype.display=function() { with(this)
{
if(_f)
{
_o.style.left = _r.offsetLeft;
_o.style.width = _r.offsetWidth;
_o.style.top = _r.offsetTop + _r.offsetHeight;
_o.style.visibility = "visible";
}
else
{
_o.style.visibility="hidden";
}
}};
jsAuto.prototype.handleEvent=function(fValue,fID) { with (this)
{
var re;
_f = false;
_r = document.getElementById( fID );
_v = fValue;
_i = eval(_i);
re = new RegExp("^" + fValue + "", "i");
if( fValue=="" ) return;
_o.innerHTML="";
for(var i=0; i<_msg.length; i++)
{
if(re.test(_msg[i]))
{
_i.append(_msg[i]);
_f = true;
}
}
_i ? _i.display() : alert("can not get instance");
}};
window.onerror=new Function("return true;");
//-->
</SCRIPT>
</HEAD>
<BODY>
<div id="divc">
<!--this is the autocomplete container.-->
</div>
<h1>Autocomplete Function</h1>
<div align="center">
<input onkeyup="jsAutoInstance.handleEvent(this.value,'auto')" id="auto">
</div>
<div id="divf">
</div>
<SCRIPT LANGUAGE="JavaScript">
<!--
var jsAutoInstance = new jsAuto("jsAutoInstance","divc");
jsAutoInstance.item("a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start");
jsAutoInstance.item("blueDestiny");
jsAutoInstance.item("BlueMiracle,Blue");
jsAutoInstance.item("angela,geniuslau");
jsAutoInstance.item("never-online");
//-->
</SCRIPT>
</BODY>
</HTML> 你把你红色部分变成动态添加数据的就OK了
一把编程的菜刀
2008-02-25
打赏
举报
回复
给你一个例子
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
body,div {
font-family:verdana;
line-height:100%;
font-size:9pt;
}
input {
width:300px;
}
h1 {
text-align:center;
font-size:2.2em;
}
#divf {
margin:10px;
font-size:0.8em;
text-align:center;
}
#divc {
border:1px solid #333333;
}
.des {
width:500px;
background-color:lightyellow;
border:1px solid #333;
padding:20px;
margin-top:20px;
}
.mouseover {
color:#ffffff;
background-color:highlight;
cursor:default;
}
.mouseout {
color:#000000;
background-color:#ffffff;
cursor:default;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function jsAuto(instaceName,objID)
{
this._msg = [];
this._o = document.getElementById( objID );
if (!this._o) return;
this._f = null;
this._i = instaceName;
this._r = null;
this._v = null;
this._o.style.visibility = "hidden";
this._o.style.lineHeight = "120%";
this._o.style.position = "absolute";
this._o.style.zIndex = "9999";
return this;
};
// mouseEvent.
jsAuto.prototype.domouseover=function(obj)
{
obj.tagName=="DIV" ? obj.className="mouseover" : obj.parentElement.className="mouseover";
};
jsAuto.prototype.domouseout=function(obj)
{
obj.tagName=="DIV" ? obj.className="mouseout" : obj.parentElement.className="mouseout";
};
jsAuto.prototype.doclick=function(msg) { with (this)
{
if(_r)
{
_r.value = msg;
_o.style.visibility = "hidden";
}
else
{
alert("javascript autocomplete ERROR :\n\n can not get return object.");
return;
}
}};
// object method;
jsAuto.prototype.item=function(msg)
{
if( msg.indexOf(",")>0 )
{
var arrMsg=msg.split(",");
for(var i=0; i<arrMsg.length; i++)
{
arrMsg[i] ? this._msg.push(arrMsg[i]) : "";
}
}
else
{
this._msg.push(msg);
}
this._msg.sort();
};
jsAuto.prototype.append=function(msg) { with (this)
{
_i ? "" : _i = eval(_i);
var div = document.createElement("DIV");
//bind event to object.
div.onmouseover = function(){_i.domouseover(this)};
div.onmouseout = function(){_i.domouseout(this)};
div.onclick = function(){_i.doclick(msg)};
var re = new RegExp("(" + _v + ")","i");
div.className = "mouseout";
if (_v) div.innerHTML = msg.replace(re , "<strong>$1</strong>");
div.style.fontFamily = "verdana";
_o.appendChild(div);
}};
jsAuto.prototype.display=function() { with(this)
{
if(_f)
{
_o.style.left = _r.offsetLeft;
_o.style.width = _r.offsetWidth;
_o.style.top = _r.offsetTop + _r.offsetHeight;
_o.style.visibility = "visible";
}
else
{
_o.style.visibility="hidden";
}
}};
jsAuto.prototype.handleEvent=function(fValue,fID) { with (this)
{
var re;
_f = false;
_r = document.getElementById( fID );
_v = fValue;
_i = eval(_i);
re = new RegExp("^" + fValue + "", "i");
if( fValue=="" ) return;
_o.innerHTML="";
for(var i=0; i<_msg.length; i++)
{
if(re.test(_msg[i]))
{
_i.append(_msg[i]);
_f = true;
}
}
_i ? _i.display() : alert("can not get instance");
}};
window.onerror=new Function("return true;");
//-->
</SCRIPT>
</HEAD>
<BODY>
<div id="divc">
<!--this is the autocomplete container.-->
</div>
<h1>Autocomplete Function</h1>
<div align="center">
<input onkeyup="jsAutoInstance.handleEvent(this.value,'auto')" id="auto">
</div>
<div id="divf">
</div>
<SCRIPT LANGUAGE="JavaScript">
<!--
var jsAutoInstance = new jsAuto("jsAutoInstance","divc");
jsAutoInstance.item("a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start");
jsAutoInstance.item("blueDestiny");
jsAutoInstance.item("BlueMiracle,Blue");
jsAutoInstance.item("angela,geniuslau");
jsAutoInstance.item("never-online");
//-->
</SCRIPT>
</BODY>
</HTML> 你把你红色部分变成动态添加数据的就OK了
gyl086
2008-02-25
打赏
举报
回复
楼上的你好啊,ajax俺没有学过,也没有用过,能不能给点代码啊?比如:数据库aa,表a1(user_name,user_sex),ip本地.
用asp来实现.谢谢!
一把编程的菜刀
2008-02-23
打赏
举报
回复
就是ajax提交数据返回后台处理再赋给隐藏DIV
Go 旅城通票
2008-02-22
打赏
举报
回复
ajax或者隐藏的iframe
ajax例子可以去这里下自己看看
http://download.csdn.net/source/297675
gyl086
2008-02-22
打赏
举报
回复
楼上大哥你好,我没用过你说的这个,能不能给点代码啊,非常感谢!
若白师妹
2008-02-22
打赏
举报
回复
ajax去做
gyl086
2008-02-22
打赏
举报
回复
我去下载过了,可是我觉得解决的不是我要的问题
一把编程的菜刀
2008-02-22
打赏
举报
回复
自己去CSDN下啊
http://download.csdn.net/source/297675
gyl086
2008-02-22
打赏
举报
回复
好的,谢谢楼上的朋友,我的邮件gyl467@163.com
cnchart
2008-02-22
打赏
举报
回复
曾经研究过多特软件站的搜索框效果,估计和你说的一样,我这有代码,很长我就不贴出来了,要的话发邮件
下拉框
自动
匹配
文本框
输入
内容
下拉框
内容
匹配
文本框
的
输入
,一个小例子,希望对新手有帮助。
可
输入
下拉列表及
文本框
自动
匹配
可
输入
的下拉列表
自动
匹配
及
文本框
输入
自动
匹配
jQuery
文本框
input
输入
关键字
自动
补全筛选代码
这是一款jQuery实现的网站
搜索
框经常用到的
文本框
input
输入
关键词后
自动
补全筛选相关
信息
的js代码。
让VC 的
文本框
智能
匹配
输入
内容
.rar
让VC 的
文本框
智能
匹配
输入
内容
,当你
输入
一两个字符的时候,
输入
框会出现与此
内容
相关的文字,就像百度
搜索
的下拉提示那样,从而很好的
匹配
用户的
输入
,省去用户的麻烦,也就提升了用户体验。
jquery js实现下拉列表智能
输入
匹配
插件.rar
jquery js实现下拉列表智能
输入
匹配
插件,相信很多朋友都知道这个功能吧,当用户
输入
的时候,会
自动
匹配
用户
输入
的字符,下拉
显示
出更多可能的
匹配
项
内容
,大家把这种功能叫做“
输入
提示”或“
输入
匹配
”等,如演示效果图所示,这种功能大部分人还是很喜欢的,可很好的提升用户的操作体验。
ASP
28,390
社区成员
357,068
社区内容
发帖
与我相关
我的任务
ASP
ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
复制链接
扫一扫
分享
社区描述
ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章