jq.ajax+php+mysql实现关键字模糊查询(示例讲解)

对于这个功能企业上还算比较实用,推荐给大家;

index.html

<Meta charset="utf-8">

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"&gt;
<script type="text/javascript">

$(".text").bind("input",function() {
if($(this).val().length>0){
search();
}else{
$(".sea").html('');

}

})
function search(){
$.ajax({
type:"GET",url:"sea.PHP",data:{"text":$(".text").val()},success:function(response){
//转换成json对象
eval("var json="+response);
//console.log(json)
var str="";
for(var i=0;i<json.length;i++){
str += "

  • " + json[i].sea + "
  • ";
    }

                $(".sea").html(str);
        }
    })

    }

    sea.PHP

    PHP $con = MysqLi_connect("localhost","username","password"); if(!$con){ echo "数据库链接失败"; exit; } MysqLi_select_db($con,'jwhuang'); MysqLi_query($con,'set names utf-8'); $text= isset($_GET['text']) ? trim($_GET['text']) : ''; $result=MysqLi_query($con,"select * from search where sea LIKE '{$text}%' "); $search=array();

    while($row=MysqLi_fetch_assoc($result)){
    //判断是否有对应的数据
    if(!$row){
    $search='';
    exit;
    }else{
    //对查询关键字进行标记
    $row['sea'] = str_replace($text,'<font color="red">' .$text. '',$row['sea']);
    $search[]=$row;

    }

    }
    echo json_encode($search);
    ?>

    效果

    完整代码下载:https://github.com/jwhuang59/Demos/tree/master/search

    以上这篇jq.ajax+PHP+MysqL实现关键字模糊查询(示例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

    相关文章

    JS原生Ajax操作(XMLHttpRequest) GET请求 POST请求 兼容性问题 利用iframe模拟ajax 实现表单提交的返回...
    AJAX 每日更新前端基础,如果觉得不错,点个star吧 &#128515; https://github.com/WindrunnerMax/E...
    踩坑Axios提交form表单几种格式 前后端分离的开发前后端, 前端使用的vue,后端的安全模块使用的SpringSe...
    很早就听闻ajax的名声,但是却一直不知道怎么用,今天自己捣鼓了一下,竟然会用了,哈哈哈哈。 为了防止...
    需要在服务器上进行哈 jquery的ajax方法: // jquery请求 $.ajax({ url: &quot;./server/slider.js...
    Ajax函数封装ajax.js // Get / Post // 参数 get post // 是否异步 // 如何处理响应数据 // URL // var...