您的位置：首页 > 编程语言 > PHP开发

ajax+php 谷歌搜索框自动填充功能 实例代码

2009-11-26 00:00 906 查看 
<html> 
<head> 
<script language="javascript"><!-- 
var http_request; 
function update(v){ 
if (window.XMLHttpRequest) { // Mozilla, Safari, ... 
http_request = new XMLHttpRequest(); 
} else if (window.ActiveXObject) { // IE 
http_request = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
http_request.onreadystatechange=out; 
var url="tp.phtml?worksheet="+v.value; 
http_request.open('GET',url,true); 
http_request.send(null); 
} 
function out(){ 
if(http_request.readyState == 4){ 
var div=document.getElementById('out'); 
if(http_request.responseText!='') { 
div.style.display='block'; 
div.innerHTML=http_request.responseText; 
//alert(div.innerHTML); 
}else{ 
div.style.display='none'; 
div.innerHTML=''; 
} 
} 
} 
function end(val){ 
document.getElementById('ws').value=val; 
document.getElementById('out').innerHTML=''; 
document.getElementById('out').style.display='none'; 
} 

// --></script> 
<style><!-- 
.test{ 
display:none; 
z-index:100; 
width:150px; 
top:20px; 
left:0px; 
height:auto; 
background-color:lightgrey; 
border:1px solid; 
position:absolute; 
} 
a:link { 
text-decoration:none; 
color:black; 
} 
a:visited { 
text-decoration:none; 
color:black; 
} 
a:hover { 
text-decoration:none; 
color:black; 
} 
--></style> 
</head> 
<body> 
<div style="position:relative;" style="position:relative;"> 
<input type='txt' id='ws' name='ws' value='' onPropertyChange='update(this);' oninput='update(this);'/> <div id='out' class='test'></div> 
<div> 
<input type='txt' id='d'/> 
</body> 
</html>

页面一 

<? 
include("include/db.inc"); 
$ws=$_GET['worksheet']; 
if(empty($ws)||strlen($ws)<3){ 
//echo 'oo'; 
exit(); 
} 
$db=new db(); 
$str=''; 
$sql="select * from user where deptID=10 and status='On' and worksheet like '%$ws%' order by worksheet"; 
$rt=$db->rtAssoc($sql); 
while($row=array_shift($rt)){ 
$str.="<a href="\" href="\""#\" onclick=\"end('" 
.$row['emp_name'].':'.$row['emp_worksheet']."');\">" 
.$row['emp_name'].':'.$row['emp_worksheet'] 
.'</a>,<br/>'; 
} 
$str=substr($str,0,-6); 
echo trim($str); 
exit(); 
?>

页面二。

这个东西功能上模仿谷歌，但是效果很不理想。一般简单的应用可以满足
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航