<%@ 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;-50px; } </style> <script type="text/javascript"> //獲得用戶輸入內(nèi)容的關(guān)聯(lián)信息的函數(shù) function getMoreContents(){ var xmlHttp; //首先要獲得用戶的輸入 var content=document.getElementById("keyword"); if(content.value==""){ return; } //然后要給服務(wù)器發(fā)送用戶輸入的內(nèi)容，因為我們采用的是ajax異步發(fā)送數(shù)據(jù) //所以我們要是有一個對象，叫做XmlHttp對象 xmlHttp=createXMLHttp(); //創(chuàng)建完之后，我們需要向服務(wù)器發(fā)送數(shù)據(jù) //escape不加的話就中文有問題 var url="search?keyword="+escape(content.value); //true表示javascript腳本會在send（）方法之后繼續(xù)執(zhí)行，而不是等待來自服務(wù)器的相應(yīng) xmlHttp.open("GET",url,true); //xmlHttp綁定回調(diào)方法，這個回調(diào)方法會在xmlHttp狀態(tài)改變的時候被調(diào)用 //xmlHttp的狀態(tài)0-4。我們只關(guān)心4（因為4表示完成） //當完成之后，再調(diào)用回調(diào)方法才有意義 xmlHttp.onreadystatechange=callback; //因為我們已經(jīng)在url中已經(jīng)寫好參數(shù)的 xmlHttp.send(null); } function createXMLHttp(){ //對于大多數(shù)的瀏覽器都適用 var xmlHttp; if(window.XMLHttpRequest){ xmlHttp=new XMLHttpRequest(); } //要考慮瀏覽器的兼容性 if(window.ActiveXObject){ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); if(!xmlHttp){ xmlHttp=new ActiveXObject("Msxm2.XMLHTTP"); } } return xmlHttp; } //回調(diào)函數(shù) function callback(){ //4代表完成 if(xmlHttp.readyState==4){ //這個200代表是響應(yīng)成功，404代表資源部存在，500代表服務(wù)器內(nèi)部錯誤 if(xmlHttp.status==200){ //這是交互成功，獲得相應(yīng)的數(shù)據(jù)，這是文本格式 var result=xmlHttp.responseText; //解析獲得 的數(shù)據(jù) var json=eval("("+result+")"); //獲得數(shù)據(jù)之后，就可以動態(tài)的顯示這些數(shù)據(jù)了，把這些數(shù)據(jù)展示到輸入框的下面 //alert(json); setContent(json); } } } //設(shè)置關(guān)聯(lián)數(shù)據(jù)的展示，參數(shù)代表的是服務(wù)器傳遞過來的關(guān)聯(lián)數(shù)據(jù) function setContent(contens){ //首先獲得管理數(shù)據(jù)的長度以此來確定生成多少<tr></tr> var size=contents.length; //設(shè)置內(nèi)容 for(var i=0;i<size;i++){ var nextNode=contens[i];//代表的是json格式數(shù)據(jù)的第i個元素 var tr=document.createElement("tr"); var td=document.createElement("td"); td.setAttribute("border","0"); td.setAttribute("bgcolor","#FFFAFA"); td.onmouseover=function(){ this.className='mouseOver'; }; td.onmouseout=function(){ this.className='mouseout'; }; td.onclick=function(){ //這個方法實現(xiàn)的是，當用鼠標點擊一個關(guān)聯(lián)的數(shù)據(jù)時，自動設(shè)置為輸入框的數(shù)據(jù) }; var text=document.createTede(nextNode); td.appendChild(text); tr.appendChild(td); document.getElementById("content_table_body").appendChild(tr); } } </script>? </head>??? <body>? <div id="mydiv">? <!-- 輸入框 -->? <input type="text" size="50" id="keyword" onkeyup="getMoreContents()"/>? <input type="button" value="百度一下" width="50px"/>? <!-- 下面是內(nèi)容展示的區(qū)域 -->? <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>
1 回答
已采納
擬人
TA貢獻37條經(jīng)驗 獲得超15個贊
別用eval()這種方式解析json字符串。
js里有自帶的json解析，JSON.parse();
如：var j = JSON.parse('{"a":1}')，
你先輸出你后臺傳過來的那個json字符串，看json格式是不是對的，注意json對象的鍵值對里鍵應(yīng)該是雙引號包裹的，
我大膽猜測你后臺傳入前臺的json字符串格式有問題，可能原因是你后臺處理json字符串里鍵的雙引號沒有轉(zhuǎn)義導(dǎo)致的，建議\"這樣轉(zhuǎn)義下試試
添加回答
舉報
0/150
提交
取消