suchen

Heim >Backend-Entwicklung >PHP-Tutorial >php随笔2-php+ajax 实现输入读取数据库显示匹配信息

php随笔2-php+ajax 实现输入读取数据库显示匹配信息

WBOY
WBOYOriginal
2016-06-23 13:25:32862Durchsuche

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

        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);     }?>

数据库：

 结果：

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：请问PHP如何显示乙未年 乙酉月 己酉日 申时Nächster Artikel：$.post 错误怎么回事？

In Verbindung stehende Artikel

Mehr sehen