ホームページ php教程 php手册 PHP ajax は Baidu 検索ドロップダウン自動プロンプト ボックスを模倣します (例付き)

PHP ajax は Baidu 検索ドロップダウン自動プロンプト ボックスを模倣します (例付き)

Jun 13, 2016 am 11:59 AM
php+ajax 落ちる 成し遂げる ヒント 検索 持っている 百度 自動

php+mysql+ajax实现百度搜索下拉提示框 主要有3个文件三个文件在同一个目录里 如下图

下面是三个文件的代码 把sql文件导入到mysql数据库里 修改下数据库密码为自己的 记得哦是UTF-8编码

php+mysql+ajax实现百度搜索下拉提示框
效果图

rpc.php文件

复制代码 代码如下:


mysql_connect('localhost', 'root' ,'');
mysql_select_db("test");
$queryString = $_POST['queryString'];
if(strlen($queryString) >0) {
$sql= "SELECT value FROM countries WHERE value LIKE '".$queryString."%' LIMIT 10";
$query = mysql_query($sql);
while ($result = mysql_fetch_array($query,MYSQL_BOTH)){
$value=$result['value'];
echo '

  • '.$value.'
  • ';
    }
    }
    ?>


    index.htm文件

    复制代码 代码如下:






    Ajax Auto Suggest








    Type your county:










    SQL データベース autoComplete.sql ファイル (mysql にインポート)

    コード コードは次のとおりです:


    -- phpMyAdmin SQL Dump
    -- version 3.3.5
    -- http://www.phpmyadmin.net
    --
    -- 主机: localhost
    -- 生成日期: 2010 年 12 月 09 日 02:36
    -- 服务器版本: 5.0.22
    -- PHP 版本: 5.2.14
    SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
    --
    -- 数据库: `test`
    --
    -- --------------------------------------------------------
    --
    -- 表的结构 `countries`
    --
    CREATE TABLE IF NOT EXISTS `countries` (
    `id` int(6) NOT NULL auto_increment,
    `value` varchar(250) NOT NULL default '',
    PRIMARY KEY (`id`)
    ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=243 ;
    --
    -- 转存表中的数据 `countries`
    --
    INSERT INTO `countries` (`id`, `value`) VALUES
    (1, 'Afghanistan'),
    (2, 'Aringland Islands'),
    (3, 'Albania'),
    (4, 'Algeria'),
    (5, 'American Samoa'),
    (6, 'Andorra'),
    (7, 'Angola'),
    (8, 'Anguilla'),
    (9, 'Antarctica'),
    (10, 'Antigua and Barbuda'),
    (11, 'Argentina'),
    (12, 'Armenia'),
    (13, 'Aruba'),
    (14, 'Australia'),
    (15, 'Austria'),
    (16, 'Azerbaijan'),
    (17, 'Bahamas'),
    (18, 'Bahrain'),
    (19, 'Bangladesh'),
    (20, 'Barbados'),
    (21, 'Belarus'),
    (22, 'Belgium'),
    (23, 'Belize'),
    (24, 'Benin'),
    (25, 'Bermuda'),
    (26, 'Bhutan'),
    (27, 'Bolivia'),
    (28, 'Bosnia and Herzegovina'),
    (29, 'Botswana'),
    (30, 'Bouvet Island'),
    (31, 'Brazil'),
    (32, 'British Indian Ocean territory'),
    (33, 'Brunei Darussalam'),
    (34, 'Bulgaria'),
    (35, 'Burkina Faso'),
    (36, 'Burundi'),
    (37, 'Cambodia'),
    (38, 'Cameroon'),
    (39, 'Canada'),
    (40, 'Cape Verde'),
    (41, 'Cayman Islands'),
    (42, 'Central African Republic'),
    (43, 'Chad'),
    (44, 'Chile'),
    (45, 'China'),
    (46, 'Christmas Island'),
    (47, 'Cocos (Keeling) Islands'),
    (48, 'Colombia'),
    (49, 'Comoros'),
    (50, 'Congo'),
    (51, 'Congo'),
    (52, ' Democratic Republic'),
    (53, 'Cook Islands'),
    (54, 'Costa Rica'),
    (55, 'Ivory Coast (Ivory Coast)'),
    (56, 'Croatia (Hrvatska)'),
    (57, 'Cuba'),
    (58, 'Cyprus'),
    (59, 'Czech Republic'),
    (60, 'Denmark'),
    (61, 'Djibouti'),
    (62, 'Dominica'),
    (63, 'Dominican Republic'),
    (64, 'East Timor'),
    (65, 'Ecuador'),
    (66, 'Egypt'),
    (67, 'El Salvador'),
    (68, 'Equatorial Guinea'),
    (69, 'Eritrea'),
    (70, 'Estonia'),
    (71, 'Ethiopia'),
    (72, 'Falkland Islands'),
    (73, 'Faroe Islands'),
    (74, 'Fiji'),
    (75, 'Finland'),
    (76, 'France'),
    (77, 'French Guiana'),
    (78, 'French Polynesia'),
    (79, 'French Southern Territories'),
    (80, 'Gabon'),
    (81, 'Gambia'),
    (82, 'Georgia'),
    (83, 'Germany'),
    (84, 'Ghana'),
    (85, 'Gibraltar'),
    (86, 'Greece'),
    (87, 'Greenland'),
    (88, 'Grenada'),
    (89, 'Guadeloupe'),
    (90, 'Guam'),
    (91, 'Guatemala'),
    (92, 'Guinea'),
    (93, 'Guinea-Bissau'),
    (94, 'Guyana'),
    (95, 'Haiti'),
    (96, 'Heard and McDonald Islands'),
    (97, 'Honduras'),
    (98, 'Hong Kong'),
    (99, 'Hungary'),
    (100, 'Iceland'),
    (101, 'India'),
    (102, 'Indonesia'),
    (103, 'Iran'),
    (104, 'Iraq'),
    (105, 'Ireland'),
    (106, 'Israel'),
    (107, 'Italy'),
    (108, 'Jamaica'),
    (109, 'Japan'),
    (110, 'Jordan'),
    (111, 'Kazakhstan'),
    (112, 'Kenya'),
    (113, 'Kiribati'),
    (114, 'Korea (north)'),
    (115, 'Korea (south)'),
    (116, 'Kuwait'),
    (117, 'Kyrgyzstan'),
    (118, 'Lao People''s Democratic Republic'),
    (119, 'Latvia'),
    (120, 'Lebanon'),
    (121, 'Lesotho'),
    (122, 'Liberia'),
    (123, 'Libyan Arab Jamahiriya'),
    (124, 'Liechtenstein'),
    (125, 'Lithuania'),
    (126, 'Luxembourg'),
    (127, 'Macao'),
    (128, 'Macedonia'),
    (129, 'Madagascar'),
    (130, 'Malawi'),
    (131, 'Malaysia'),
    (132, 'Maldives'),
    (133, 'Mali'),
    (134, 'Malta'),
    (135, 'Marshall Islands'),
    (136, 'Martinique'),
    (137, 'Mauritania'),
    (138, 'Mauritius'),
    (139, 'Mayotte'),
    (140, 'Mexico'),
    (141, 'Micronesia'),
    (142, 'Moldova'),
    (143, 'Monaco'),
    (144, 'Mongolia'),
    (145, 'Montserrat'),
    (146, 'Morocco'),
    (147, 'Mozambique'),
    (148, 'Myanmar'),
    (149, 'Namibia'),
    (150, 'Nauru'),
    (151, 'Nepal'),
    (152, 'Netherlands'),
    (153, 'Netherlands Antilles'),
    (154, 'New Caledonia'),
    (155, 'New Zealand'),
    (156, 'Nicaragua'),
    (157, 'Niger'),
    (158, 'Nigeria'),
    (159, 'Niue'),
    (160, 'Norfolk Island'),
    (161, 'Northern Mariana Islands'),
    (162, 'Norway'),
    (163, 'Oman'),
    (164, 'Pakistan'),
    (165, 'Palau'),
    (166, 'Palestinian Territories'),
    (167, 'Panama'),
    (168, 'Papua New Guinea'),
    (169, 'Paraguay'),
    (170, 'Peru'),
    (171, 'Philippines'),
    (172, 'Pitcairn'),
    (173, 'Poland'),
    (174, 'Portugal'),
    (175, 'Puerto Rico'),
    (176, 'Qatar'),
    (177、「ルニオン」)、
    (178、「ルーマニア」)、
    (179、「ロシア連邦」)、
    (180、「ルワンダ」)、
    (181、「聖人」ヘレナ')、
    (182、'セントクリストファー・ネイビス')、
    (183、'セントルシア')、
    (184、'サンピエール・ミクロン')、
    (185、 'セントビンセントおよびグレナディーン諸島')、
    (186、'サモア')、
    (187、'サンマリノ')、
    (188、'サントメ・プリンシペ')、
    ( 189, 'サウジアラビア')、
    (190, 'セネガル')、
    (191, 'セルビアおよびモンテネグロ')、
    (192, 'セイシェル')、
    (193, 'シエラレオネ')、
    (194、'シンガポール')、
    (195、'スロバキア')、
    (196、'スロベニア')、
    (197、'ソロモン諸島')、
    (198、「ソマリア」)、
    (199、「南アフリカ」)、
    (200、「サウスジョージアおよびサウスサンドイッチ諸島」)、
    (201、「スペイン」) 、
    (202、'スリランカ')、
    (203、'スーダン')、
    (204、'スリナム')、
    (205、'スバールバル諸島およびヤンマイエン諸島')、
    (206, 'スワジランド')、
    (207, 'スウェーデン')、
    (208, 'スイス')、
    (209, 'シリア')、
    (210, '台湾')、
    (211、'タジキスタン')、
    (212、'タンザニア')、
    (213、'タイ')、
    (214、'トーゴ')、
    (215, 'トケラウ')、
    (216, 'トンガ')、
    (217, 'トリニダード・トバゴ')、
    (218, 'チュニジア')、
    (219 、「トルコ」)、
    (220、「トルクメニスタン」)、
    (221、「タークス・カイコス諸島」)、
    (222、「ツバル」)、
    (223、「ウガンダ」) ')、
    (224、'ウクライナ')、
    (225、'アラブ首長国連邦')、
    (226、'英国')、
    (227、'アメリカ合衆国') ')、
    (228、'ウルグアイ')、
    (229、'ウズベキスタン')、
    (230、'バヌアツ')、
    (231、'バチカン市国')、
    (232, 'ベネズエラ')、
    (233, 'ベトナム')、
    (234, 'ヴァージン諸島 (イギリス)')、
    (235, 'ヴァージン諸島 (アメリカ)')、
    (236、'ウォリス・フツナ諸島')、
    (237、'西サハラ')、
    (238、'イエメン')、
    (239、'ザイール')、
    (240, 'ザンビア')、
    (241, 'ジンバブエ');


    你在本地服务器测试下一定很给力かつ原理很简单没那么麻烦
    このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

    ホットAIツール

    Undresser.AI Undress

    Undresser.AI Undress

    リアルなヌード写真を作成する AI 搭載アプリ

    AI Clothes Remover

    AI Clothes Remover

    写真から衣服を削除するオンライン AI ツール。

    Undress AI Tool

    Undress AI Tool

    脱衣画像を無料で

    Clothoff.io

    Clothoff.io

    AI衣類リムーバー

    Video Face Swap

    Video Face Swap

    完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

    ホットツール

    メモ帳++7.3.1

    メモ帳++7.3.1

    使いやすく無料のコードエディター

    SublimeText3 中国語版

    SublimeText3 中国語版

    中国語版、とても使いやすい

    ゼンドスタジオ 13.0.1

    ゼンドスタジオ 13.0.1

    強力な PHP 統合開発環境

    ドリームウィーバー CS6

    ドリームウィーバー CS6

    ビジュアル Web 開発ツール

    SublimeText3 Mac版

    SublimeText3 Mac版

    神レベルのコード編集ソフト(SublimeText3)

    2か月後、人型ロボットWalker Sが服をたたむことができるようになった 2か月後、人型ロボットWalker Sが服をたたむことができるようになった Apr 03, 2024 am 08:01 AM

    Machine Power Report 編集者: Wu Xin 国内版の人型ロボット + 大型模型チームは、衣服を折りたたむなどの複雑で柔軟な素材の操作タスクを初めて完了しました。 OpenAIのマルチモーダル大規模モデルを統合したFigure01の公開により、国内同業者の関連動向が注目を集めている。つい昨日、中国の「ヒューマノイドロボットのナンバーワン株」であるUBTECHは、Baidu Wenxinの大型モデルと深く統合されたヒューマノイドロボットWalkerSの最初のデモを公開し、いくつかの興味深い新機能を示した。 Baidu Wenxin の大規模モデル機能の恩恵を受けた WalkerS は次のようになります。 Figure01 と同様に、WalkerS は動き回るのではなく、机の後ろに立って一連のタスクを完了します。人間の命令に従って服をたたむことができる

    Baidu Apollo、L4自動運転に対応した世界初の大型モデル「Apollo ADFM」を発売 Baidu Apollo、L4自動運転に対応した世界初の大型モデル「Apollo ADFM」を発売 Jun 04, 2024 pm 08:01 PM

    5月15日、Baidu Apolloは武漢Baidu キャロット Auto Robot Zhixing Valleyで2024年アポロデーを開催し、過去10年間におけるBaiduの自動運転における大きな進歩を包括的に実証し、大型モデルと乗客の安全性の新たな定義に基づいた技術的飛躍をもたらした。世界最大の自動運転ネットワークである百度は、自動運転を人間の運転よりも安全なものにしました。このおかげで、より安全、より快適、環境に優しい、低炭素の旅行方法が理想から現実へと変わりつつあります。百度グループ副社長兼インテリジェント・ドライビング・ビジネス・グループ社長の王雲鵬氏はその場で「自動運転車を開発するという私たちの本来の目的は、より良い旅行への人々の高まる切望を満たすことだ。人々の満足こそが私たちの原動力である。なぜなら安全性、とても美しいので、見ることができて嬉しいです

    Baidu Tieba アプリで操作が頻繁すぎるというメッセージが表示されますが、何が問題なのでしょうか? Baidu Tieba アプリで操作が頻繁すぎるというメッセージが表示されますが、何が問題なのでしょうか? Apr 01, 2024 pm 05:06 PM

    Baidu Tieba アプリは、操作が頻繁すぎることを示すプロンプトを表示します。このプロンプトは、通常、プラットフォームの通常の操作とユーザー エクスペリエンスを維持して、悪意のある画面スパム、広告スパム、その他の不適切な動作を防ぐためのものです。具体的な処理方法については、共有されたチュートリアルを読むことができます編集者による。 Baidu Tieba アプリで「操作が頻繁すぎる」というメッセージが表示される場合の対処方法を共有する 1. 「操作が頻繁すぎる」というメッセージが表示されたら、しばらく待つ必要がありますが、不安な場合は、別のことを先に行ってください。通常、しばらく待つと、このプロンプトメッセージは自動的に消え、正常に使用できるようになります。 2. 長時間待っても「操作が頻繁すぎます」と表示される場合は、Tieba Emergency Bar、Tieba Feedback Bar、およびその他の公式 Tieba にアクセスしてこの現象を報告し、公式担当者に解決を依頼することができます。 3.

    百度のロビン・リー氏は石油・ガス業界のインテリジェンスについて話し合うためにチームを率いてペトロチャイナを訪問した 百度のロビン・リー氏は石油・ガス業界のインテリジェンスについて話し合うためにチームを率いてペトロチャイナを訪問した May 07, 2024 pm 06:13 PM

    5月7日の当サイトのニュースによると、5月6日、百度の創業者兼会長兼最高経営責任者(CEO)のロビン・リー氏がチームを率いて北京の中国石油天然気集団公司(以下、ペトロチャイナ)を訪問し、同社の取締役らと会談した。中国石油総公司の董事長と戴侯良党書記が会談した。両者は協力を強化し、エネルギー産業とデジタルインテリジェンスの深い統合を促進することについて綿密な意見交換を行った。ペトロチャイナはデジタル中国石油総公司の構築を加速し、百度グループとの協力を強化し、エネルギー産業とデジタルインテリジェンスの徹底的な統合を促進し、国家エネルギー安全保障の確保にさらに貢献する。ロビン・リー氏は、大型モデルによって示される「インテリジェントな創発」と理解、生成、論理、記憶といった中核的な機能によって、最先端技術と石油・ガス事業の組み合わせに対する想像力のより広い空間が開かれたと述べた。いつも

    Alibaba Cloud Disk で他の人のリソースを検索する方法 Alibaba Cloud Disk で他の人のリソースを検索する方法 Mar 30, 2024 am 10:31 AM

    この人気のストレージ ツールである Alibaba Cloud Disk は、個人リソースを効率的に管理できるだけでなく、多くの便利な機能も提供します。多くのユーザーは検索時にクラウド ディスク リソースを見つけることができないため、ディスク全体のすべてのリソースを検索したいと考えていますので、以下では、このサイトの編集者がこの質問に詳しく答え、具体的な検索方法を共有します。知りたい場合は、この記事に従って詳細をご覧ください。 Alibaba Cloud Disk で他の人のリソースを検索する方法 1. まず、Alibaba Cloud Disk のフォルダー ディレクトリでリソース ファイルの特定のパスを検索し、対応するフォルダーを見つけます。 2. 次に、ファイル検索機能を使用して、検索したいキーワードを入力して、関連するファイルの内容を見つけます。 3. 次に、リンクを他の人と共有して、直接検索してダウンロードします

    百度西陽貝殻の入手方法を紹介 百度西陽貝殻の入手方法を紹介 Mar 28, 2024 am 09:11 AM

    西浪には貝殻の場所と入手方法が分からないユーザーがたくさんいます。数時間探してもまだ見つからないプレイヤーもいます。以下では、編集者が百度西陽貝殻の入手方法を紹介します。 . ぜひ見に来てください。 Baidu Xirang Shell の入手方法 1. まずコミュニティに来てから、下の写真の場所に来る必要があります。 2. ここで目的地を選択し、188階に入​​るを選択します。 3. 188 階に入った後、歩いているとこのプロンプトが表示されるので、「了解しました」をクリックします。 4. 砲弾の場所は少し見つけにくいですが、188 エレベーターのすぐ後ろに、砲弾である小さな光る点があります。 5. 貝殻をクリックするには VR コントローラーを使用する必要があります。引き換え方法 1. まず、ページ右上隅の「設定」アイコンをクリックし、「」を選択します。

    Deepseek Webバージョンの入り口Deepseek公式ウェブサイトの入り口 Deepseek Webバージョンの入り口Deepseek公式ウェブサイトの入り口 Feb 19, 2025 pm 04:54 PM

    DeepSeekは、Webバージョンと公式Webサイトの2つのアクセス方法を提供する強力なインテリジェント検索および分析ツールです。 Webバージョンは便利で効率的であり、公式ウェブサイトは包括的な製品情報、ダウンロードリソース、サポートサービスを提供できます。個人であろうと企業ユーザーであろうと、DeepSeekを通じて大規模なデータを簡単に取得および分析して、仕事の効率を向上させ、意思決定を支援し、イノベーションを促進することができます。

    Samsung Galaxy S24シリーズ携帯電話の中国版「Search in Circle」がGoogle検索に対応すると報じられている Samsung Galaxy S24シリーズ携帯電話の中国版「Search in Circle」がGoogle検索に対応すると報じられている Jun 01, 2024 am 09:54 AM

    5月31日のニュースによると、ブロガー@ibinguniverseが本日、Samsung Galaxy S24シリーズ携帯電話の中国版「Search in Circle」がGoogle検索をサポートするというニュースを伝えた。ブロガーは具体的な発売時期については明らかにしなかった。 Samsungの以前の紹介によると、Samsung Galaxy S24シリーズは多くの高レベルのAI機能、入力、翻訳、レコーダー、メモ、カメラなどのAIベースの実用的な機能を搭載しており、ユーザーにより便利で効率的な包括的なサービスを提供します。経験。海外版とは異なり、Samsung Galaxy S24シリーズのAI機能のほとんどはBaiduなどの国内メーカーが提供しています。以前に報告されたように、Galaxy AI は、Baidu Wenxin 大型モデルの複数の機能を深く統合しており、エンドサイド対応の通話機能と翻訳機能、および生成 AI によってもたらされるインテリジェントな要約を提供できます。

    See all articles