首頁 php教程 php手册 php+ajax做仿百度搜索下拉自动提示框(有实例)

php+ajax做仿百度搜索下拉自动提示框(有实例)

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, 'Runion'),
    (178, 'Romania'),
    (179, 'Russian Federation'),
    (180, 'Rwanda'),
    (181, 'Saint Helena'),
    (182, 'Saint Kitts and Nevis'),
    (183, 'Saint Lucia'),
    (184, 'Saint Pierre and Miquelon'),
    (185, 'Saint Vincent and the Grenadines'),
    (186, 'Samoa'),
    (187, 'San Marino'),
    (188, 'Sao Tome and Principe'),
    (189, 'Saudi Arabia'),
    (190, 'Senegal'),
    (191, 'Serbia and Montenegro'),
    (192, 'Seychelles'),
    (193, 'Sierra Leone'),
    (194, 'Singapore'),
    (195, 'Slovakia'),
    (196, 'Slovenia'),
    (197, 'Solomon Islands'),
    (198, 'Somalia'),
    (199, 'South Africa'),
    (200, 'South Georgia and the South Sandwich Islands'),
    (201, 'Spain'),
    (202, 'Sri Lanka'),
    (203, 'Sudan'),
    (204, 'Suriname'),
    (205, 'Svalbard and Jan Mayen Islands'),
    (206, 'Swaziland'),
    (207, 'Sweden'),
    (208, 'Switzerland'),
    (209, 'Syria'),
    (210, 'Taiwan'),
    (211, 'Tajikistan'),
    (212, 'Tanzania'),
    (213, 'Thailand'),
    (214, 'Togo'),
    (215, 'Tokelau'),
    (216, 'Tonga'),
    (217, 'Trinidad and Tobago'),
    (218, 'Tunisia'),
    (219, 'Turkey'),
    (220, 'Turkmenistan'),
    (221, 'Turks and Caicos Islands'),
    (222, 'Tuvalu'),
    (223, 'Uganda'),
    (224, 'Ukraine'),
    (225, 'United Arab Emirates'),
    (226, 'United Kingdom'),
    (227, 'United States of America'),
    (228, 'Uruguay'),
    (229, 'Uzbekistan'),
    (230, 'Vanuatu'),
    (231, 'Vatican City'),
    (232, 'Venezuela'),
    (233, 'Vietnam'),
    (234, 'Virgin Islands (British)'),
    (235, 'Virgin Islands (US)'),
    (236, 'Wallis and Futuna Islands'),
    (237, 'Western Sahara'),
    (238, 'Yemen'),
    (239, 'Zaire'),
    (240, 'Zambia'),
    (241, 'Zimbabwe');


    你在本地服务器测试下 一定很给力 而且原理很简单 没那么麻烦
    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

    熱AI工具

    Undresser.AI Undress

    Undresser.AI Undress

    人工智慧驅動的應用程序,用於創建逼真的裸體照片

    AI Clothes Remover

    AI Clothes Remover

    用於從照片中去除衣服的線上人工智慧工具。

    Undress AI Tool

    Undress AI Tool

    免費脫衣圖片

    Clothoff.io

    Clothoff.io

    AI脫衣器

    Video Face Swap

    Video Face Swap

    使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

    熱工具

    記事本++7.3.1

    記事本++7.3.1

    好用且免費的程式碼編輯器

    SublimeText3漢化版

    SublimeText3漢化版

    中文版,非常好用

    禪工作室 13.0.1

    禪工作室 13.0.1

    強大的PHP整合開發環境

    Dreamweaver CS6

    Dreamweaver CS6

    視覺化網頁開發工具

    SublimeText3 Mac版

    SublimeText3 Mac版

    神級程式碼編輯軟體(SublimeText3)

    2 個月不見,人形機器人 Walker S 會摺衣服了 2 個月不見,人形機器人 Walker S 會摺衣服了 Apr 03, 2024 am 08:01 AM

    機器之能報道編輯:吳昕國內版的人形機器人+大模型組隊,首次完成疊衣服這類複雜柔性材料的操作任務。隨著融合了OpenAI多模態大模型的Figure01揭開神秘面紗,國內同行的相關進展一直備受關注。就在昨天,國內"人形機器人第一股"優必選發布了人形機器人WalkerS深入融合百度文心大模型後的首個Demo,展示了一些有趣的新功能。現在,得到百度文心大模型能力加持的WalkerS是這個樣子的。和Figure01一樣,WalkerS沒有走動,而是站在桌子後面完成一系列任務。它可以聽從人類的命令,折疊衣物

    百度Apollo重磅發表全球首個支援L4級自動駕駛的大模型Apollo ADFM 百度Apollo重磅發表全球首個支援L4級自動駕駛的大模型Apollo ADFM Jun 04, 2024 pm 08:01 PM

    5月15日,百度Apollo在武漢百度蘿蔔快跑汽車機器人智行谷舉辦ApolloDay2024,全方位展示百度十年深耕自動駕駛的重大進展,基於大模型帶來技術階躍、面向乘客安全全新定義的無人車和全球最大的無人車自動營運網絡,百度已經做到自動駕駛比人類駕駛更安全。得益於此,更安全舒適、綠色低碳的出行方式正從理想成為現實。百度集團副總裁、智慧駕駛事業群組總裁王雲鵬現場表示:「我們做無人車的初衷,是滿足老百姓日益增長的、對美好出行的嚮往,人民群眾的滿意是我們前進的動力。因為安全、所以美好,我們欣喜地看到

    百度貼吧app提示操作太頻繁怎麼回事 百度貼吧app提示操作太頻繁怎麼回事 Apr 01, 2024 pm 05:06 PM

    百度貼吧app提示操作過於頻繁這種提示通常是為了維護平台的正常運作和用戶體驗,以防止惡意刷屏、廣告刷帖等不當行為,具體的處理方法各位可以看小編分享教程哦。百度貼吧app提示操作過於頻繁處理方法分享1、當系統提示【操作太頻繁】的時候,我們需要等待一段時間,如果著急可以先去做一點別的事情,一般等待一會兒之後,這個提示信息就會自動消失,這時候我們就可以正常使用了。 2.如果等了很久之後,它還是顯示【操作過於頻繁】,我們可以嘗試去貼吧應急吧、貼吧意見反饋吧等官方貼吧,發帖反饋這種現象,請求官方人員解決。 3、

    百度李彥宏率隊拜訪中國石油,討論油氣產業智慧化 百度李彥宏率隊拜訪中國石油,討論油氣產業智慧化 May 07, 2024 pm 06:13 PM

    本站5月7日消息,5月6日,百度創辦人、董事長兼執行長李彥宏帶隊在北京拜訪中國石油天然氣集團有限公司(以下簡稱「中國石油」),並與中國石油集團董事長、黨組書記戴厚良舉行會談。雙方就強化合作,推動能源產業與數位化智慧化深度融合進行了深入交流。中國石油將加速推動數位中中國石油建設,加強與百度集團合作,推動能源產業與數位化智慧化的深度融合,為保障國家能源安全做出更大貢獻。李彥宏表示,大模型展現的「智慧湧現」與理解、生成、邏輯、記憶等核心能力,為前沿科技與油氣業務結合開啟了更廣闊的想像空間。一直

    阿里雲盤怎麼搜尋別人的資源 阿里雲盤怎麼搜尋別人的資源 Mar 30, 2024 am 10:31 AM

    阿里雲盤,這款備受歡迎的儲存工具,不僅可以幫助我們有效率地管理個人資源,還提供了許多便利功能。那麼許多用戶在搜尋雲盤資源的時候,可能會搜不到,所以想要搜尋全盤的所有資源,那麼在下文中就由本站小編來為大家詳細解答這一問題,分享具體的搜尋方法,想要了解的使用者就快來跟著本文一起操作了解吧!阿里雲盤搜怎麼索別人的資源1、先在阿里雲盤的資料夾目錄中搜尋資源檔案的具體路徑即可找到對應的資料夾了。 2.然後使用文件搜尋功能,輸入想要尋找的關鍵字即可找到相關的文件內容。 3.接著我們透過其他人分享鏈接,直接定位和下

    百度息壤貝殼取得方法介紹 百度息壤貝殼取得方法介紹 Mar 28, 2024 am 09:11 AM

    在息壤中有不少用戶不知道貝殼在哪裡,怎麼才能獲得,有些玩家轉了幾個小時候都沒有找到,下面小編就帶來了百度息壤貝殼的獲取方法,快來一起看看吧。百度息壤貝殼怎麼獲得1、首先我們需要來到社區,然後來到下圖的這個位置。 2、在這裡選擇目的地,選擇進入188樓。 3.進入188層後,在周圍轉悠會有這個提示,點擊我知道了就行。 4.貝殼的位置可能會有些難找,就在188電梯的後面,有個發光的小點就是貝殼。 5.撿貝殼要用VR把手才能撿,點擊貝殼就可以了。兌換方式1、先點選頁面右上方的「設定」圖標,在設定中選擇「

    deepseek網頁版入口 deepseek官網入口 deepseek網頁版入口 deepseek官網入口 Feb 19, 2025 pm 04:54 PM

    DeepSeek 是一款強大的智能搜索與分析工具,提供網頁版和官網兩種訪問方式。網頁版便捷高效,免安裝即可使用;官網則提供全面產品信息、下載資源和支持服務。無論個人還是企業用戶,都可以通過 DeepSeek 輕鬆獲取和分析海量數據,提升工作效率、輔助決策和促進創新。

    消息指出三星 Galaxy S24 系列手機國行版「即圈即搜」將支援Google搜尋 消息指出三星 Galaxy S24 系列手機國行版「即圈即搜」將支援Google搜尋 Jun 01, 2024 am 09:54 AM

    5月31日消息,根據部落客@i冰宇宙今日爆料,三星GalaxyS24系列手機國行版「即圈即搜」將支援Google搜尋。具體上線時間,該部落客並未透露。根據三星先前介紹,三星GalaxyS24系列實裝了眾多高階AI能力,將輸入、翻譯、錄音機、筆記、相機等實用功能AI化,為使用者帶來更方便、更有效率的綜合體驗。與海外版不同的是,三星GalaxyS24系列的AI功能大多由國內廠商提供服務,例如百度等。先前報導,GalaxyAI深度整合百度文心大模型多項能力,可提供端側賦能的通話、翻譯功能,以及借助生成式AI帶來的智能摘

    See all articles