您好,欢迎访问一九零五行业门户网

jquery创建一个ajax关键词数据搜索实现思路_jquery

在web开发过程当中,我们经常需要在前台页面输入关键词进行数据的搜索,我们通常使用的搜索方式是将搜索结果用另一个页面显示,这样的方式对于搭建高性能网站来说不是最合适的,今天给大家分享一下如何使用 jquery,mysql 和 ajax创建简单和有吸引力的 ajax 搜索,这是继《使用jquery打造一个实用的数据传输模态弹出窗体》第二篇jquery项目实际运用的教程,希望大家在开发项目的时候能够根据自己的实际情况灵活运用
点击搜索默认显示所有的结果
输入a之后显示的搜索结果
输入 p之后显示的搜索结果
没有找到相关的搜索词页面
演示 -点击下面的搜索按钮搜索数据文件结构 主要用到几个文件  index.php首页 dbcon.php数据库连接文件 search.php搜索处理页面
第一步创建一个ajax_search的数据库,紧接着创建一个ajax_search表
复制代码 代码如下:
create table `ajax_search` (
`id` int(11) not null auto_increment,
`firstname` varchar(50) not null,
`lastname` varchar(50) not null,
`age` int(11) not null,
`hometown` varchar(50) not null,
`job` varchar(50) not null,
primary key (`id`)
) engine=innodb default charset=utf8 auto_increment=5 ;
html  :index.php--程序主页面
复制代码 代码如下:
ajax 教程:使用jquery和mysql创建一个ajax搜索
ajax 教程:使用jquery和mysql创建一个ajax搜索
db connect:dbcon.php--数据库连接文件
复制代码 代码如下:
搜索结果页面search.php代码如下
复制代码 代码如下:
checkvalues函数过滤字符串防止sql注入和跨站点脚本攻击,mysql_query($sql);用来查询语句,mysql_fetch_assoc()用来循环输出结果,怎么样是不是很简单,如果你的项目有需要,可以直接使用这个代码
其它类似信息

推荐信息