誰有能運行的search.jsp的代碼啊，發一下。我的不能運行，只能得到那個xmlHttp對象，感激不盡，
我在那個callback那個函數那里就沒反應了
丶子非魚
2017-12-04
4 回答
舉報
0/150
提交
取消
2018-06-13
td.onclick?=?function(){????????????????????//這個方法實現的是，當用鼠標點擊一個關聯數據時，關聯數據自動填充到輸入框中。?????????????????????????????????????};這個里面的代碼怎么寫2018-02-26
<%@?page?language="java"?import="java.util.*"?pageEncoding="UTF-8"%> <html> ??<head> ????<style?type="text/css"> ???? #mydiv{ ???? position:?absolute; ???? left:50%; ???? top:50%; ???? margin-left:?-200px; ???? margin-top:?-120px; ???? } ???? .mouseOver{ ???? background:?#708090; ???? color:#FFFAFA; ???? } ???? .mouseOut{ ???? background:?#FFFAFA; ???? color:#000; ???? } ????</style> ????<script?type="text/javascript"> ???? var?xmlHttp; ???? //1.獲得用戶輸入內容的關聯信息的函數 ???? function?getMoreContents(){ ???? //首先獲得用戶輸入 ???? var?content?=?document.getElementById("keyword"); ???? if(content.value?==?""){ ???? //當輸入框為空時，清空之前的數據 ???? clearContent(); ???? return; ???? } ???? //alert(content.value); ???? //2.然后要給服務器發送用戶輸入的內容,因為我們采用的是ajax異步發送數據，所以我們要使用xmlHttp對象 ???? //xmlHttp?=?獲得xmlHttp對象; xmlHttp?=?createXMLHttp();?? //alert(xmlHttp);?? ???? //3.要給服務器發送數據,首先定義一個服務器的地址， ???? var?url?=?"search?keyword="+escape(content.value); ???? //true表示JavaScript腳本會在send()方法之后繼續執行，而不會等待來自服務器的響應。 ???? xmlHttp.open("GET",url,true); ???? //xmlHttp綁定回調方法，這個回調方法會在xmlHttp狀態改變的時候會被調用 ???? //xmlHttp的狀態：0-4，我們只關心4(complete)這個狀態，所以說當完成之后，再調用回調函數才有意義。 ???? xmlHttp.onreadystatechange?=?callback; ???? //參數已經在url中了，不用在此處添加參數 ???? xmlHttp.send(null); ???? } ???? ???? ???? ???? //獲得xmlHttp對象 ???? function?createXMLHttp(){ ???? //對于大多數瀏覽器都適用的 ???? var?xmlHttp; ???? if(window.XMLHttpRequest){ ???? xmlHttp?=?new?XMLHttpRequest(); ???? } ???? //要考慮瀏覽器的兼容性 ???? if(window.ActiveXObject){ ???? xmlHttp?=?new?ActiveXObject("Microsoft.XMLHTTP"); ???? //如果瀏覽器有ActiveXObject對象，但沒有Microsoft.XMLHTTP的參數 ???? if(!xmlHttp){ ???? xmlHttp?=?new?ActiveXObject("Msxml2.XMLHTTP"); ???? } ???? } ???? return?xmlHttp; ???? } ???? //回調函數 ???? function?callback(){ ???? //4表示完成 ???? if(xmlHttp.readyState?==?4){ ???? //200代表服務器響應成功，404代表資源未找到，500代表服務器內部錯誤 ???? if(xmlHttp.status?==?200){ ???? //交互成功，獲得相應的數據，是文本格式。 ???? var?result?=?xmlHttp.responseText; ???? //解析獲得的數據 ???? var?json?=?eval("("+result+")"); ???? //獲得這些數據之后，就可以動態的顯示數據了。把這些數據展示到輸入框下面。 ???? //alert(json); ???? setContent(json); ???? } ???? } ???? } ???? //設置關聯數據的展示，參數代表服務器傳遞過來的關聯數據 ???? function?setContent(contents){ ???? //清空之前的數據 ???? clearContent(); ???? //設置位置 ???? setLocaltion(); ???? //首先獲得關聯數據的長度，以此來確定生成多少個<tr></tr> ???? var?size?=?contents.length; ???? //設置內容 ???? for(var?i?=0;i?<?size;i++){ ???? var?nextNode?=?contents[i];//代表json數據的第i個元素 ???? var?tr?=?document.createElement("tr"); ???? var?td?=?document.createElement("td"); ???? td.setAttribute("borde","0"); ???? td.setAttribute("gbcolor","#FFFAFA"); ???? //為td綁定兩個樣式（鼠標進入和鼠標移出時事件） ???? td.onmouseover?=?function(){ ???? this.className?=?'mouseOver'; ???? }; ???? td.onmouseout?=?function(){ ???? this.className?=?'mouseOut'; ???? }; ???? td.onclick?=?function(){ ???? //這個方法實現的是，當用鼠標點擊一個關聯數據時，關聯數據自動填充到輸入框中。 ???? ???? }; ???? td.onmousedown?=?function(){ ???????????? //當鼠標點擊一個關聯數據時，自動在輸入框添加數據 ???????????? document.getElementById("keyword").value?=this.innerText; ???????????}; ???????????//鼠標懸浮于關聯數據上時，自動添加到輸入框中 ???? ?/*?td.onmouseover?=?function(){ ?????????????this.className?=?'mouseOver'; ?????????????if(td.innerText?!=?null) ?????????????document.getElementById("keyword").value?=this.innerText; }?*/ ???? ???? ???? //創建一個文本節點 ???? var?text?=?document.createTextNode(nextNode); ???? td.appendChild(text); ???? tr.appendChild(td); ???? document.getElementById("content_table_body").appendChild(tr); ???? } ???? } ???? //清空之前的數據 ???? function?clearContent(){ ???? var?contentTableBody?=?document.getElementById("content_table_body"); ???? var?size?=?contentTableBody.childNodes.length; ???? //刪除時，從下往上刪 ???? for(var?i?=?size-1;i>=0;i--){ ???? //指定刪除第i個子節點 ???? contentTableBody.removeChild(contentTableBody.childNodes[i]); ???? } ???? //清除關聯數據的外邊框 ???? var?popDiv?=?document.getElementById("popDiv").style.border="none"; ???? ???? } ???? //當輸入框失去焦點時，清空之前的數據 ???? function?keywordBlur(){ ???? clearContent(); ???? } ???? //設置顯示關聯信息的位置 ???? function?setLocaltion(){ ???? //關聯信息的顯示位置要和輸入框一致 ???? var?content?=?document.getElementById("keyword"); ???? var?width?=?content.offsetWidth;//輸入框的長度 ???? var?left?=?content["offsetLeft"];//到左邊框的距離 ???? var?top?=?content["offsetTop"]+content.offsetHeight;//到頂部的距離(加上輸入框本身的高度) ???? //獲得顯示數據的div ???? var?popDiv?=?document.getElementById("popDiv"); ???? popDiv.style.border?=?"gray?1px?solid"; ???? popDiv.style.left?=?left+"px"; ???? popDiv.style.top?=?top+"px"; ???? popDiv.style.width?=?width+"px"; ???? document.getElementById("content-table").style.width?=?width+"px"; ???? } ????</script> ??</head> ?? ??<body> ???<div?id="mydiv"> ??? <!--?輸入框?--> ??? <input?type="text"?size="50"?id="keyword"?onkeyup="getMoreContents()"?onblur="keywordBlur()"?onfocus="getMoreContents()"/> ??? <input?type="button"?value="百度一下"?width="50px"/> ??? <!--?下面是內容展示區域?--> ??? <div?id="popDiv"> ??? <table?id="content-table"?bgcolor="#FFFAFA"?border="0"?cellspacing="0"?cellpadding="0"> ??? <tbody?id="content_table_body"> ??? <!--?動態查詢出來的數據顯示在這里?--> ??? ??? </tbody> ??? </table> ??? </div> ???</div> ??</body> </html>2017-12-04
<%@ page language="java" contentType="text/html; charset=utf-8"
? ? pageEncoding="utf-8"%>
<html>
<head>
<title>Insert title here</title>
<style type="text/css">
? ? ?#mydiv{
? ? ? ? position:absolute;
? ? ? ? left:50%;
? ? ? ? top:50%;
? ? ? ? margin-left:-200px;
? ? ? ? margin-top:-50px;
? ? ?}
? ? ?
? ? ?.mouseOver{
? ? ?background:#708090;
? ? ?color:#FFAFA;
? ? ?}
? ? ?.mouseOut{
? ? ? ?background:#FFAFA;
? ? ? ?color:#000000;
? ? ?}
</style>
<script type="text/javascript">
? ? ? ? var xmlHttp;
? ? ? ?function getMoreContents(){
? ? ? var content=document.getElementById("keyword");
? ? ? if(content.value==""){
? ? ? clearContent();
? ? ? return;
? ? ? }
? ? ? xmlHttp=getXmlHttpObject();
? ? // ? alert(xmlHttp);
? ? ? var url="search?keyword="+escape(content.value);
? ? //true ?表示js腳本會在send()方法之后繼續執行，而不會等待來自服務器的響應
? ? ? xmlHttp.open("GET",url,true)
? ? ? //xmlHttp綁定回調方法，這個回調方法會在xmlHttp狀態改變的時候被調用
? ? ? //xmlHttp的狀態0-4 ，我們只關心4（complete）這個狀態，所以說完整之后再調用回調方法才有意義
? ? ? ? ? ? ?xmlHttp.onreadystatechange=callback;
? ? ? ? xmmlHttp.send(null);
? ? ? ? alert(xmlHttp);
? ? ? ?}
? ? ? ?function getXmlHttpObject(){
? ? ? var xmlHttp;
? ? ? if(window.XMLHttpRequest){
? ? ? xmlHttp=new XMLHttpRequest(); ??
? ? ? }
? ? ? if(window.ActiveXObject){
? ? ?xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
? ? ?if(!xmlHttp){
? ? ?xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
? ? ?}
? ? ? }
? ? ? return xmlHttp; ??
? ? ? ?}
? ? ? ?
? ? ? ?function callback(){
? ? ? if(xmlHttp.readyState==4){
? ? ? if(xmlHttp.status==200){
? ? ? //交互成功，獲得相應的數據，是文本格式（json）
? ? ? var result=xmlHttp.responseText;
? ? ? //解析獲得json數據
? ? ? var json =eval("("+result+")");
? ? ? //獲得數據之后，就可以動態顯示這些數據了，展示到輸入框下面
? ? ? alert(json);
? ? ? setContent(json);
? ? ? }
? ? ??
? ? ? }
? ? ? ?}
? ? ? ?
? ? ? ? function setContent(contents){
? ? ? ? ? ? ? ?clearContent();
? ? ? ? ? ? ? ?setLocaton();
? ? ? ? ? ? ? var size=contans.length;
? ? ? ? ? ? ? for(var i=0;i<size;i++){
? ? ? ? ? ? ? var nextNode=contans[i];
? ? ? ? ? ? ? var tr=document.createElement("tr");
? ? ? ? ? ? ? var td=document.createElement("td");
? ? ? ? ? ? ? td.setAttribute("border","0");
? ? ? ? ? ? ? td.setAtrribute("bgcolor","#FFFAA");
? ? ? ? ? ? ? td.omnmouseover=function(){
? ? ? ? ? ? ? this.calssName="mouseOver";
? ? ? ? ? ? ? };
? ? ? ? ? ? ? td.onmouseout=function(){
? ? ? ? ? ? ? this.calssName="mouseOut";
? ? ? ? ? ? ? };
? ? ? ? ? ? ? td.onclick=function(){
? ? ? ? ? ? ? //這個方法實現的是，當鼠標點擊關聯數據時，自動設置為輸入框的數據
? ? ? ? ? ? ? };
? ? ? ? ? ? ? var text=document.createTextNode(nextNode);
? ? ? ? ? ? ? td.appendChild(text);
? ? ? ? ? ? ? tr.appendChild(td);
? ? ? ? ? ? ? document.getElementById("content_table_body").appendChild(tr);
? ? ? ? ? ? ? } ? ? ?
? ? ? ? }
? ? ? ??
? ? ? ? function clearContent(){
? ? ? ? var contentTableBody=document.getElementById("content_table_body");
? ? ? ? var size=contentTableBody.childNodes.length;
? ? ? ? for(var i=size-1;i>=0;i--){
? ? ? ? contentTableBody.removeChild(contentTableBody.childNodes[i]);
? ? ? ? }
? ? ? ? document.getElementById("popDiv").style.border="none";
? ? ? ? }
? ? ? ? //當輸入框失去焦點（不去點他）的時候，關聯信息清空
? ? ? ? function keywordBlur(){
? ? ? ? clearContent();
? ? ? ? }
? ? ? ? //設置顯示關聯信息的位置
? ? ? ? function setLocaton(){
? ? ? ?
? ? ? ? var content=document.getElementById("keyword");
? ? ? ? var width=content.offsetWidth; //輸入框的距離
? ? ? ? var left=content["offsetLeft"];//距離左邊框的距離
? ? ? ? var top=content["offsetTop"]+content.offsetHeight;//距離頂部距離
? ? ? ? //獲得顯示數據的div
? ? ? ? var popDiv=document.getElementById("popDiv");
? ? ? ? popDiv.style.border="black 1px solid";
? ? ? ? popDiv.style.left=left+"px";
? ? ? ? popDiv.style.top=top+"px";
? ? ? ? popDiv.style.width=width+"px";
? ? ? ? document.getElementById("content_table").style.width=width="px";
? ? ? ? }
</script>
</head>
<body>
? ? <div id="mydiv">
? ? ? ? ? <input type="text" size="50" id="keyword" ?onkeyup="getMoreContents()"
? ? ? ? ? onblur="keywordBlur()" onfocus="getMoreContents()"/> ??
? ? ? ? ? <input type="button" value="百度一下" width="50px"/>
? ? ? ? ? <!-- 下面是內容展示區域 -->
? ? ? ? ? <div id="popDiv">
? ? ? ? ? ? ?<table id="content_table" bgcolor="#FFAFA" border="0" cellspacing="0"
? ? ? ? ? ? ? ? ?cellpadding="0">
? ? ? ? ? ? ?<tbody id="content_table_body">
? ? ? ? ? ? ?
? ? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? ?<!-- 動態查詢的數據顯示在這里 -->
? ? ? ? ? ? ? ?<!-- ? ?<tr><td>ajax</td></tr>
? ? ? ? ? ? ? ? ? ? <tr><td>ajax2</td></tr>
? ? ? ? ? ? ? ? ? ? ? <tr><td>ajax1</td></tr> -->
? ? ? ? ? ? ?</tbody>
? ? ? ? ? ? ?
? ? ? ? ? ? ?</table>
? ? ? ? ? </div>
? ? ? </div>
</body>
</html>
2017-12-04
我是用eclipse弄得 ??