復制代碼 代碼如下:
// JavaScript Document
function onChangehoverLi(thisLi){
$("#searchtext").val($(thisLi).html());
$("#suggest_ul").hide(0);
validateform2();
}
$(function(){
//載入時隱藏下拉li
$("#suggest_ul").hide(0);
});
//Ajax 動態獲取關鍵字
//監聽文本框輸入變化
function fuzzySearch(){
//創建ajax對象函數
function createLink(){
if(window.ActiveXObject){
var newRequest = new ActiveXObject("Microsoft.XMLHTTP");
}else{
var newRequest = new XMLHttpRequest();
}
return newRequest;
}
//如果文本框為空，不發送請求
if($("#searchtext").val().length==0||$("#searchtext").val().length>10){
$("#suggest_ul").hide(0);
return;
}
//發送請求
http_request = createLink();//創建一個ajax對象
if(http_request){
var sid = $("#searchtext").val();
var url = "contentSearchAction!getSynonyms.action";
var data = "keywords="+encodeURI(sid);
//alert(data)
http_request.open("post",url,true);
http_request.setRequestHeader("content-type","application/x-www-form-urlencoded");
//指定一個函數來處理從服務器返回的結果
http_request.onreadystatechange = dealresult; //此函數不要括號
//發送請求
http_request.send(data);
}
//處理返回結果
function dealresult(){
if(http_request.readyState==4){
//等于200表示成功
if(http_request.status==200){
if(http_request.responseText=="no"){
$("#suggest_ul").hide(0);
return;
}
$("#suggest_ul").show(0);
var res = eval("("+http_request.responseText+")");
var contents="";
for(var i=0;i<res.length;i++){
var keywords = res[i].keywords;
contents=contents+"<li>"+keywords+"</li>";
}
$("#suggest_ul").html(contents);
}
}
}
}
//鼠標
$(function(){
//按下按鍵后300毫秒顯示下拉提示
$("#searchtext").keyup(function(){
setInterval(changehover,300);
function changehover(){
$("#suggest_ul li").hover(function(){ $(this).css("background","#eee");},function(){ $(this).css("background","#fff");});
}
});
});
復制代碼 代碼如下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>searchSuggest</title>
<link href="css/searchSuggest.css" type="text/css" >
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/searchSuggest.js"></script>
<style>
#suggest_ul{
width:100%;
max-height:223px;
margin:0px;
padding:0px;
border:1px solid #ccc;
background-color:#ffffff;
list-style-type:none;
}
#suggest_ul li{
padding-left:5px;
line-height:22px;
font-size:13px;
width:100%;
height:22px;
cursor:default;
}
</style>
</head>
<body>
<div>
<form action="deal.php" method="get">
<input type="text" autocomplete="off" value="search..." oninput="fuzzySearch();" onblur="if(this.value==''){this.value='search...'}" onfocus="if(this.value=='search...'){this.value=''}"/>
<input type="submit" value="搜索一下" />
</form>
<ul>
</ul>
</div>
</body>
</html>
新聞熱點
疑難解答
圖片精選
