快速业务通道

仿Google的搜索下拉框

作者 佚名技术 来源 NET编程 浏览 发布时间 2012-04-12

default.aspx

<%@ Page Language="C#" AutoEventWireup="true" EnableEventValidation="false"  CodeFile="Default.aspx.cs" Inherits="_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>无标题页</title>
<style>
ul,li {
    list-style:none;
 margin-left: 1px;
 margin-bottom:0;
 padding: 0;
 border: 0;
 list-style-type: none;
 list-style-image: none;
}
.show {
    z-index:99;
    font-size:12px;
    border:1px outset;
}
.show span {
    float:right;
}
.show div {
    width:100%;
    height:100%;
}
.show div ul li span {
    float:right;
}
.show div ul li {
    text-align:left;
    color:red;
    width:100%;
    cursor:default;
}
.blue {
    background:#0A246A;color:#ffffff;text-decoration:none;
}
.white {
    background:#ffffff;
}
</style>
<script type="text/javascript">
function CPos(x, y)
{
    this.x = x;
    this.y = y;
}
//获取控件的位置
function GetObjPos(ATarget)
{
    var target = ATarget;
    var pos = new CPos(target.offsetLeft, target.offsetTop);
   
    var target = target.offsetParent;
    while (target)
    {
        pos.x += target.offsetLeft;
        pos.y += target.offsetTop;
       
        target = target.offsetParent
    }
   
    return pos;
}
function showdivtxt(txtobj){
 showtxt.style.width=txtobj.offsetWidth;
 var p = GetObjPos(txtobj);
 showtxt.style.left=p.x;
 showtxt.style.top=p.y+txtobj.offsetHeight;
if(txtobj.value.replace(/(\s*$)/g, "")!=""){
//异步取数据
 var ds = _Default.SearchTxt(txtobj.value).value;
 var s;
 if (ds.Tables[0].Rows.length>0){
        s="<ul>";
     showtxt.style.display=''block'';
     for(var i=0;i<ds.Tables[0].Rows.length;i++){
         s+="<li class=''white'' onclick=\"<%=this.tb_search.ClientID %>.value=''"+ds.Tables[0].Rows[i]["tagword"]+"'';showtxt.style.display=''none'';\" onmouseout=''changebgw(this);'' onmouseover=''changebgb(this);''><span style=''color:green;''>"+ds.Tables[0].

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号