ホームページ >バックエンド開発 >PHPチュートリアル >PHP+ajaxリアルタイム入力自動検索マッチング方式

PHP+ajaxリアルタイム入力自動検索マッチング方式

墨辰丷
墨辰丷オリジナル
2018-06-07 09:57:212665ブラウズ

この記事では主にphp+ajaxリアルタイム入力を使った自動検索とマッチングの方法を紹介しますので、興味のある方は参考にしていただければ幸いです。

dropbox_index.php

dropbox.js ajax

<!DOCTYPE html>
<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.css

.txt{高さ:22px;ボーダー:1pxソリッド#cdcdcd;幅:220p x;border-right:none ; }

.btn{background-color:#FFF; border:1px Solid #CDCDCD;height:26px; width:70px;}


responsepage.php

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;
    }
Database:

概要

:以上がこの記事の全内容です。皆さんの学習に役立つことを願っています。

関連する推奨事項:

PHP の ZipArchive 関数の機能

php データをシリアル化および逆シリアル化する方法

PHP がオペレーティング システムの種類を取得する方法

以上がPHP+ajaxリアルタイム入力自動検索マッチング方式の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。