asp自动提示

 ##################################HTML 代码:
<input  name="searchkey" type="text" style="FONT-SIZE:" onFocus="this.select()" onBlur="hideDiv();"  οnclick="keyupdeal(event);" onKeyDown="keydowndeal(event);" onKeyUp="keyupdeal(event);" onKeyPress="if (browser=='IE'){keyupdeal(event);}" onMouseOver="this.focus()" value="" size="21" maxlength="30" 9pt; background-color:="background-color:" #ffffff class="keyword" id="searchkey" autocomplete="off"/>
<div id="keytishi"></div>

##################################JS 代码:
<script>
function onsearchkeyblur()
{
 document.getElementById("keytishi").style.display = "none";
}
<!--

//建立XMLHttpRequest对象

var xmlhttp;
var browser;
browser='IE';//默认为IE浏览器
  var j=-1;
  var temp_str;
  var $=function(node){
   return document.getElementById(node);
  }
  var $$=function(node){
   return document.getElementsByTagName(node);
  }
try{
    xmlhttp= new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
    try{
        xmlhttp= new ActiveXObject('Microsoft.XMLHTTP');
    }catch(e){
        try{
            xmlhttp= new XMLHttpRequest();
   browser="Mozilla";
        }catch(e){}
    }
}

function getKeyWord(){
    var obj = document.getElementById("searchkey");//获取文本域对象
 if(obj.name != "searchkey"){return;}
    if(obj.value==""){
        return;
    }
    var top=0;
    var left=0;
    while(obj){//此循环得到文件域对象在页面中的绝对位置
        top += obj["offsetTop"];
        left += obj["offsetLeft"];
        obj = obj.offsetParent;
    }
    xmlhttp.open("get","CL_KWIPT.asp?keyword="+document.getElementById("searchkey").value,true);
    xmlhttp.onreadystatechange = function(){
        if(xmlhttp.readyState == 4)
        {
            if(xmlhttp.status == 200)
            {
                if(xmlhttp.responseText!=""){
                    document.getElementById("keytishi").innerHTML = unescape(xmlhttp.responseText);//把后台返回的数据填充到提示层
                    document.getElementById("keytishi").style.left = left + "px";//设置提示层的位置,左
                    document.getElementById("keytishi").style.top = (top + 25) + "px";//设置提示层的位置,上
                    document.getElementById("keytishi").style.display = "block";//设置提示层可见
                }else{
                    document.getElementById("keytishi").innerHTML = "";//清空提示层
                    document.getElementById("keytishi").style.display = "none";//设置提示层不可见
                }
            }
            else{
           
            }
        }
    }
    xmlhttp.setRequestHeader("If-Modified-Since","0");
    xmlhttp.send(null);
}
function hideDiv(){
       document.getElementById("keytishi").innerHTML = "";//清空提示层
       document.getElementById("keytishi").style.display = "none";//设置提示层不可见
}
//监听键盘事件
  function keyupdeal(e){
   var keyc;
   if(window.event){
    keyc=e.keyCode;
    }
   else if(e.which){
    keyc=e.which;
    }
   if(keyc!=40 && keyc!=38){
    getKeyWord();
    temp_str=$("searchkey").value;
   }
   }

  function set_style(num){
   for(var i=0;i<$$("li").length;i++){
    var li_node=$$("li")[i];
    if(li_node.getAttribute("id")=='ajax'){
     li_node.className="";
     li_node.childNodes[1].className="r";
     li_node.style.backgroundColor="#FFFFFF"; 
    }
   }
   if(j>=0 && j<$$("li").length){
    var i_node=$$("li")[j];
    if(i_node.getAttribute("id")=='ajax'){
     i_node.style.backgroundColor="#3366CC";
     i_node.className='focusLi';
     i_node.childNodes[1].className='r_focus';
    }

   }
  }
  function mo(nodevalue){
   j=nodevalue;
   set_style(j);
   if(j>=0 && j<$$("li").length){
    $("searchkey").value=$$("li")[j].childNodes[0].childNodes[0].nodeValue;
   }
   else{
    $("searchkey").value=temp_str;
   }
  }
  function form_submit(){
   if(j>=0 && j<$$("li").length){
    $("searchkey").value=$$("li")[j].childNodes[0].childNodes[0].nodeValue;
    }
   hideDiv();
   //document.search.submit();
  }
  function hide_suggest(){
   var nodes=document.body.childNodes;
   for(var i=0;i<nodes.length;i++){
    if(nodes[i]!=$("searchkey")){
     $("keytishi").innerHTML="";
     }
    }
   }
   
function keydowndeal(e){
   var keyc;
   if(window.event){
    keyc=e.keyCode;
    }
   else if(e.which){
    keyc=e.which;
    }
   if(keyc==40 || keyc==38){
   if(keyc==40){
    if(j<$$("li").length){
     j++;
     if(j>=$$("li").length){
      j=-1;
     }
    }
    if(j>=$$("li").length){
      j=-1;
     }
   }
   if(keyc==38){
    if(j>=0){
     j--;
     if(j<=-1){
      j=$$("li").length;
     }
    }
    else{
     j=$$("li").length-1;
    }
   }
   set_style(j);
   if(j>=0 && j<$$("li").length){
    $("searchkey").value=$$("li")[j].childNodes[0].childNodes[0].nodeValue;
    }
   else{
    $("searchkey").value=temp_str;
    }
   }
  }
 
//-->
// JavaScript Document
</script>
###########################################  CSS样式
<style type="text/css">
<!--
.keyword{width:150px; height:20px; border:#666666 1px solid;}/**//*文本框样式*/
#keytishi{width:300px; height:auto; border:#666666 1px solid; position:absolute; background-color:#FFFFFF; display:none;z-index:9999;}/**//*提示层样式*/
#keytishi ul{
 margin:0px;
 padding: 0px;
}/**//*提示层样式*/
#keytishi ul li{
 margin:0;
 list-style-type:none;
 line-height:16px;
 height:16px;
 font-size:12px;
 padding:2px;
 cursor:pointer;
 background-color: #FFFFFF;
}
.focusLi{
 margin:0;
 list-style-type:none;
 line-height:16px;
 height:16px;
 font-size:12px;
 padding:2px;
 background-color: #3366CC;
 cursor:pointer;
 color: #FFFFFF;
}
.l{margin:0px 0px 0px 3px;float:left;}
.r{color: #006600;float:right;}

.r_focus{color: #FFFFFF;float:right;}
-->
</style>
########################################   后台代码

<!--#include file="conn.asp"-->
<%
    dim rs
    dim sql
    dim keyWords
    keyWrods = Request("keyword")
    Set rs = Server.CreateObject("ADODB.Recordset")
    sql = "select top 10 C_KWords,C_Pnum from shop_keywordCount where C_KWords like '"&keyWrods&"%' and C_Pnum<>0 or C_Pnum<>null order by C_Pnum desc"
 rs.open sql,conn,1,1
    if not (rs.bof and rs.eof) then
    Response.Write("<ul>")
 dim liNo
 liNo = 0
    do while not rs.eof
%>
<li οnmοuseοver="mo(this.value)" οnclick="form_submit()" value="<%= liNo %>" id='ajax'><span class="l"><%Response.Write(escape(rs("C_KWords")&"</span><span class='r'>约"&rs("C_Pnum")&"件商品</span>"))%></li>
<%
     rs.movenext
  liNo = liNo+1
    loop
    Response.Write("<ul>")
    end if
    rs.close
    set rs = nothing
    conn.close
    Set conn = nothing
%>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值