Home >Web Front-end >JS Tutorial >How to implement keyword fuzzy query in jq.ajax+php+mysql

How to implement keyword fuzzy query in jq.ajax+php+mysql

亚连Original: 2018-06-14 14:11:441727browse

Below I will share with you an article about jq.ajax php mysql implementing keyword fuzzy query (example explanation), which has a good reference value and I hope it will be helpful to everyone.

This function is quite practical for enterprises and is recommended to everyone;

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<style>
*{margin:0;padding:0;}
.text{width:200px;height:30px;line-height:30px;font-size:14px;outline:none;}
ul{width:200px;height:auto;border:1px solid #999;border-top:none;}
ul li{width:200px;height:30px;line-height:30px;font-size:14px;}
li:hover{background:#ddd;}
</style>

<body>
<input type="text" class="text" name="text">
<ul class="sea"></ul>

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

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

	}
})
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 += "<li>" + json[i].sea + "</li>";
				}

				$(".sea").html(str);
		}
	})
}
</script>
</body>
</html>

sea.php

<?php
$con = mysqli_connect("localhost","username","password");
if(!$con){
	echo "数据库链接失败";
	exit;
}
mysqli_select_db($con,&#39;jwhuang&#39;);
mysqli_query($con,&#39;set names utf-8&#39;);
$text= isset($_GET[&#39;text&#39;]) ? trim($_GET[&#39;text&#39;]) : &#39;&#39;;
$result=mysqli_query($con,"select * from search where sea LIKE &#39;{$text}%&#39; ");
$search=array();

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

Rendering

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

How to implement sliding verification required for login in js

##How to implement the fuzzy query function of the drop-down box in Angular

About crypto module security knowledge in Nodejs (detailed tutorial)

The above is the detailed content of How to implement keyword fuzzy query in jq.ajax+php+mysql. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：nodejs+server.js creates web serverNext article：nodejs+server.js creates web server

See more

How to implement keyword fuzzy query in jq.ajax+php+mysql

Related articles