php+ajax 实现输入读取数据库显示匹配信息
程序员文章站
2023-11-29 23:42:16
废话不多说了，直接跟大家贴代码了
dropbox_index.php
废话不多说了，直接跟大家贴代码了
dropbox_index.php
<!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=gb2312" />
<title>主搜索引擎下拉框自动显示数据</title>
</head>
<script src="js/dropbox.js" type="text/javascript"></script>
<link href="css/dropbox.css" type="text/css" rel="stylesheet"/>
<body>
<form action="" method="post" enctype="multipart/form-data">
<input name="txt" id="txt" class="txt" type="text" onkeyup ="showhint(this.value)" />
<input type="submit" class="btn" name="submit" value="upload" /><br />
<span id="txthint" class="file-box"></span>
</form>
</body>
</html>
dropbox.js ajax
var xmlhttp
function showhint(str)
{
if (str.length==0)
{
document.getelementbyid("txthint").innerhtml=""
return
}
xmlhttp=getxmlhttpobject()
if (xmlhttp==null)
{
alert ("browser does not support http request")
return
}
var url="responsepage.php"
url=url+"?q="+str
url=url+"&sid="+math.random()
xmlhttp.onreadystatechange=statechanged
xmlhttp.open("get",url,true)
xmlhttp.send(null)
}
//设置回调函数
function statechanged()
{
if (xmlhttp.readystate==4 || xmlhttp.readystate=="complete")
{
document.getelementbyid("txthint").innerhtml=xmlhttp.responsetext
}
}
function getxmlhttpobject()
{
var xmlhttp=null;
try
{
// firefox, opera 8.0+, safari
xmlhttp=new xmlhttprequest();
}
catch (e)
{
// internet explorer
try
{
xmlhttp=new activexobject("msxml2.xmlhttp");
}
catch (e)
{
xmlhttp=new activexobject("microsoft.xmlhttp");
}
}
return xmlhttp;
}
dropbox.css
.txt{ height:22px; border:1px solid #cdcdcd; width:220px;border-right:none;}
.btn{ background-color:#fff; border:1px solid #cdcdcd;height:26px; width:70px;}
responsepage.php
<?php
//get the q parameter from url
$q=$_get["q"];
//全部小写化
$q=strtolower($q);
//非空验证
if(isset($q) && $q != '')
{
$con = mysql_connect("localhost","root","lifu");
if(!$con)
{
die('could not connect: ' .mysql_error());
}
mysql_select_db("my_db",$con);
$sql = "select * from persons";
//$sql="select firstname from persons where firstname like '%$q%'";
$result =mysql_query($sql,$con);
while($row = mysql_fetch_array($result))
{
//匹配判断
if(stristr(strtolower($row['firstname']),$q))
{
//echo "-----------------persons-----------------";
echo /* "firstname:" .*/ $row['firstname'] . "<br />";
//echo "lastname:" . $row['lastname'] . "<br />";
//echo "age:" . $row['age'] . "<br />";
}
//echo $row['firstname'] . "<br />";
}
mysql_close($con);
}
?>
数据库：
以上就是本文给大家介绍的php+ajax 实现输入读取数据库显示匹配信息的全部内容，希望大家喜欢。