Maison >interface Web >js tutoriel >jQuery+AJAX+PHP+MySQL développe une fonction de recherche sans saut ni actualisation
Cet article présente principalement la fonction de recherche de développement jQuery+AJAX+PHP+MySQL sans saut ni actualisation. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer
. Points de connaissance : ajax soumet le formulaire, php interroge la base de données, php renvoie le tableau json et javascript parcourt et génère le tableau json
1 Lorsqu'aucun mot-clé n'est saisi dans le. formulaire, retournez "Veuillez saisir des mots-clés..."
2 Lorsque la requête par mot-clé saisie dans le formulaire échoue, retournez "Non. résultats "
3. Lorsque la requête par mot-clé saisie dans le formulaire a des résultats, les résultats seront renvoyés.
index.html
nbsp;html> <meta> <meta> <title>AJAX搜索</title> <style> *{margin:0px;padding:0px;} h2{ text-align: center; } #search_con{ width: 300px; margin:10px auto; } #keywords{ width: 300px; margin-top: 10px; height: 30px; } #btn{ width: 305px; height: 35px; margin-top: 10px; } #search_result{ width: 300px; margin:30px auto; } </style> <script></script> <script> $(function(){ $("button").click(function(){ var inputVal = $("#keywords").val(); $.ajax({ type:"GET", url:"search.php?keywords=" + inputVal, dataType:"json", success:function(data){ $(function(){ var con=""; $.each(data,function(i,data){ if (data.result == "0") { con+="<p>请输入关键词..." }else if(data.result == "1"){ con+="<p>无结果" }else{ con+="<p>"+data.title+"" } }); console.log(con); $("#search_result").html(con); }) return false; } }) }) }) </script> <!-- 表单 --> <p> </p>
search.php
<?php header("Content-type:application/json"); //定义参数 $keywords = $_GET["keywords"]; //获取数据库配置 require_once("config.php"); //连接数据库 $con = mysql_connect($host,$username,$password); if (!$con) { die('连接数据库失败,失败原因:' . mysql_error()); } //设置数据库字符集 mysql_query("SET NAMES UTF8"); //查询数据库 mysql_select_db($db, $con); //过滤关键词左右空格 $keyword = trim($keywords); if (empty($keyword)) { //如果关键词为空,则返回result=0 echo "[{\"result\":\"0\"}]"; }else{ $result = mysql_query("SELECT * FROM $tb WHERE title like '%$keyword%' ORDER BY ID DESC"); $num = mysql_num_rows($result); if ($num) { $search_result = array(); while($row = mysql_fetch_array($result)){ $search_result[] = $row; } // 将数组转成json格式 echo json_encode($search_result); }else{ //如果查询无果,则返回result=1 echo "[{\"result\":\"1\"}]"; } } ?>
config.php
<?php //配置文件 - BY TANKING $host="localhost"; $username="root"; $password="root"; $db="test"; $tb="datalist"; ?>
Nom de la base de données : test
Nom de la table : datalist
Champs : id, titre, url
Analyse de champ :
id - ID à incrémentation automatique
titre - titre
url - lien de page
Ce qui précède est le contenu de cet article Tout le contenu, j'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !
Recommandations associées :
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!