<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage=""%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<title></title>
<script language="javascript" type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if (window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
//根据输入的内容进行关联查找
function search(){
createXMLHttpRequest();
var inputWord = document.getElementById('inputWord').value;
var url="/AJAX/houtai.jsp?inputWord="+inputWord;
xmlHttp.open("get",url,true);
xmlHttp.onreadystatechange = display;
xmlHttp.send(null);
}
//将服务器返回的数据列入下拉提示框中
function display(){
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
var xmlDoc = xmlHttp.responseXML;
clearDivData();
changeDivData(xmlDoc);
document.getElementById('wordsListDiv').style.visibility='visible';
}
}
}
//清除下拉提示框中已有的数据
function clearDivData(){
document.getElementById('wordsListTbody').innerHTML='';
}
//实际将数据加入下拉提示框
function changeDivData(xmlDoc){
//alert(xmlDoc);
var words = xmlDoc.childNodes[0].childNodes;
var tbody = document.getElementById('wordsListTbody');
//alert(words[0].firstChild.nodeValue);
for(i=0;i<words.length;i++){
var newTr = document.createElement('tr');
var newCell = document.createElement('td');
var text = words[i].firstChild.nodeType;
var textNode = document.createTextNode(words[i].firstChild.data);
newCell.appendChild(textNode);
newTr.appendChild(newCell);
tbody.appendChild(newTr);
}
HOUTAI.JSP
<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*,java.util.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
无标题文档
<%
String inputWord= request.getParameter("inputWord");
HashMap map = new HashMap();
map.put("a","aababcabcdabcde");
map.put("ab","ababcabcdabcde");
map.put("abc","abcabcdabcde");
map.put("abcd","abcdabcde");
map.put("abcde","abcde");
response.setContentType("text/xml;charset=gb2312");
if(!map.containsKey(inputWord)){
System.out.println("");
out.println("");
}else{
out.println(map.get(inputWord).toString());
}
%>
}
//设置下拉提示框的位置
function setDivPosition(){
document.getElementById('wordsListDiv').style.left=document.getElementById('inputWord').offsetLeft+'px';
document.getElementById('wordsListDiv').style.border='black 1px solid';
document.getElementById('wordsListDiv').style.top=
document.getElementById('inputWord').offsetTop+document.getElementById('inputWord').offsetHeight;
document.getElementById('wordsListTable').style.width=document.getElementById('inputWord').offsetWidth+'px';
}
<p>
搜索字符串:
<input type="text" id="inputWord" onKeyUp="search()">
<div id="wordsListDiv" style="position:absolute;visibility:hidden">
<table id="wordsListTable">
<tbody id="wordsListTbody">
<tr>
<td>
test
</td>
</tr>
<tr>
<td>
test
</td>
</tr>
<tr>
<td>
test
</td>
</tr>
</tbody>
</table>
</div>
<body>
没有反应是哪里出问题了,帮忙指点下