php网站中怎么查询数据库并用ajax实时显示结果

发布网友发布时间：2022-04-07 04:43

我来回答

共2个回答

懂视网时间：2022-04-07 09:05

PHP结合AJAX实现搜索提示功能

首先将创建一个输入框；然后监听输入框的keyup事件，当事件触发时，使用AJAX请求将输入的内容发送给PHP；接着PHP根据输入的内容进行数据查找并返回；最后将返回的数据进行渲染即可。

示例代码

客户端：

<script> 
 $(document).ready(function(){ 
 var xhr=null; 
 $('input[name="keyword"]').keyup(function() { 
  if(xhr){ 
   xhr.abort();//如果存在ajax的请求，就放弃请求 
  } 
  var inputText= $.trim(this.value); 
  if(inputText!=""){//检测键盘输入的内容是否为空，为空就不发出请求 
  xhr=$.ajax({ 
  type: 'GET', 
  url: 'service/suggestion.php', 
  cache:false,//不从浏览器缓存中加载请求信息 
  data: "keyword=" + inputText,//向服务器端发送的数据 
  dataType: 'json',//服务器返回数据的类型为json 
  success: function (json) { 
   if (json.length != 0) {//检测返回的结果是否为空 
   var lists = "<ul>"; 
   $.each(json, function () { 
    lists += "<li>"+this.pd_name+"</li>";//遍历出每一条返回的数据 
   }); 
   lists+="</ul>"; 
 
   $("#searchBox").html(lists).show();//将搜索到的结果展示出来 
 
   $("li").click(function(){ 
    $("#keyword").val($(this).text());//点击某个li就会获取当前的值 
    $("#searchBox").hide(); 
   }) 
 
   } else { 
   $("#searchBox").hide(); 
   } 
 
 
  } 
 
  }); 
  }else{ 
  $("#searchBox").hide();//没有查询结果就隐藏搜索框 
  } 
 }).blur(function(){ 
  $("#searchBox").hide();//输入框失去焦点的时候就隐藏搜索框 
 }); 
 
 }); 
</script>

服务端：

<?php 
session_start(); 
 
function connectDb(){//连接数据库的函数 
$db_server="localhost"; 
$db_name="test";//数据库的名称 
$db_user="root";//数据库的用户名，不同的用户权限不同 
$db_pwd="";//数据库的密码 
$dsn="mysql:host=$db_server;dbname=$db_name;charset=utf8";//使用PDO的方法连接数据库 
 
try{ 
$connect=new PDO($dsn,$db_user,$db_pwd,array(PDO::ATTR_PERSISTENT=>true));//如果需要数据库长连接，需要最后加一个参数 
 
} 
catch(PDOException $e){ 
 exit('数据库连接失败'); 
} 
 return $connect; 
 
} 
 
function test($keyword){//从数据库中查找关键字的函数 
$db=connectDb(); 
$result=$db->prepare("select 字段名 from 数据库名字 where 字段名 like ?"); 
$result->bindParam(1,$keyword);//第一个问号的值 
$result=>execute; 
 
return $result->fetchAll(PDO::FETCH_ASSOC); 
 
 
} 
 
$keyword=$_GET['keyword'];//获取输入框的内容 
 
$suggestion=test($keyword); 
 
echo json_encode($suggestion);//输出查询的结果（json格式输出） 
 
?>

推荐教程：《PHP教程》

热心网友时间：2022-04-07 06:13

$.ajax({url:"page.html",success:function(data){$('#div_area').html(data);}});