<!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> <title></title> <style type="text/css"> #container { width:400px; margin:200px auto; } #txtSearch { width:300px; } #divwd { width:300px; border:1px solid gray; } #divwd ul { list-style-type:none; margin:0px; padding:0px; } </style> <script type="text/javascript"> //eval("alert('abc')");// var s = "[\"ab\",\"abc\"]";// var array = eval(s);// alert(array[0]); var xmlhttp = createXHR(); function createXHR() { var xhr; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } return xhr; } window.onload = function () { document.getElementById("txtSearch").onkeyup = function () { //判断有没有动态生成的div，如果有 则删除 var div = document.getElementById("divwd"); if (div) { document.getElementById("container").removeChild(div); } var wd = this.value; if (wd.length == 0) { return; } //2 初始化 xmlhttp.open("get", "03-baidu.ashx?wd=" + wd, true); //3 xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4) { if (xmlhttp.status == 200) { //["a","ab"] var s = xmlhttp.responseText; //把数组样子的字符串转化成数组对象 var array = eval(s); //exec("") //动态创建div div = document.createElement("div"); div.id = "divwd"; document.getElementById("container").appendChild(div); //动态创建ul var ul = document.createElement("ul"); div.appendChild(ul); //循环生成li for (var i = 0; i < array.length; i++) { var li = document.createElement("li"); li.innerHTML = array[i]; ul.appendChild(li); li.onmouseover = function () { this.style.backgroundColor = "red"; } li.onmouseout = function () { this.style.backgroundColor = ""; } } } } } //4 xmlhttp.send(); }; } </script></head><body> <div id="container"> <input type="text" id="txtSearch" /><input type="button" value="search" id="btnSearch" /> </div></body></html>-----------------------------------------------------------------
请求页
<%@ WebHandler Language="C#" class="_03_baidu" %>using System;using System.Web;using System.Collections.Generic;public class _03_baidu : IHttpHandler { public void ProcessRequest (HttpContext context) { context.Response.ContentType = "text/plain"; string wd = context.Request.QueryString["wd"]; string s = GetWd(wd); context.Response.Write(s); } private string GetWd(string wd) { //所有数据 List<string> list = new List<string>() { "\"abc\"", "\"abb\"", "\"阿宝\"", "\"abcc式的词语\"", "\"阿碧\"", "\"abac式的\"", "\"acfun\"", "\"angelababy\"", "\"akb48\"", "\"a67\"", "\"apple\"", "\"a67手机电影mp4下载\"", "\"app\"", "\"adobe reader\"", "\"all star\"", "\"adobe flash player\"" }; wd = wd.Replace("\"", ""); //查找以wd开头的字符串 List<string> newList = new List<string>(); foreach (string item in list) { string ss = item.Replace("\"", ""); if (ss.Length > wd.Length) { string s = ss.Substring(0, wd.Length); if (s.ToLower() == wd.ToLower()) { newList.Add(item); } } } //拼成 ["a","b","c"]的样子 string result = "["; foreach (string item in newList) { result = result + item + ","; } //去掉最后一个, result = result.TrimEnd(','); result += "]"; return result; } public bool IsReusable { get { return false; } }}
转载于:https://www.cnblogs.com/eric-gms/p/3471010.html
相关资源：模拟百度搜索下拉显示（同步刷新）