JQuery KeyUp Live Search. Как?

Я пытаюсь выяснить, почему я могу заставить свой живой поиск работать, но он возвращает все результаты из таблицы mysql независимо от того, что я набираю. Может быть, вы могли бы помочь?

Я пытаюсь получить предыдущий запрос и инициировать новый по каждой клавиатуре.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Help Tool 2.0</title> <link type="text/css" rel="stylesheet" href="assets/css/index.css" /> <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> </head> <body> <script type="text/javascript"> $(function(){ $('#search-box').keyup(function() { $("#results").html(''); var xhr; var keywords = $(this).val(); if(xhr != null) xhr.abort(); xhr = $.get("search.php", {q: keywords}, function() { //alert("success"); }) .success(function(data) { xhr = null; //alert("second success"); $("#results").html(data); }) }); }); </script> <input id="search-box" name="q" type="text" /> <div id="results"></div> </body> </html> 

И PHP:

 <?php include_once ('database_connection.php'); if(isset($_GET['q'])){ $keyword = trim($_GET['q']) ; $keyword = mysqli_real_escape_string($dbc, $keyword); $query = "select topictitle,topicdescription from topics where topictitle like '%$q%' or topicdescription like '%$q%'"; //echo $query; $result = mysqli_query($dbc,$query); if($result){ if(mysqli_affected_rows($dbc)!=0){ while($row = mysqli_fetch_array($result,MYSQLI_ASSOC)){ echo '<p> <b>'.$row['topictitle'].'</b> '.$row['topicdescription'].'</p>'; } }else { echo 'No Results for :"'.$_GET['q'].'"'; } } }else { echo 'Parameter Missing'; } ?> 

Related of "JQuery KeyUp Live Search. Как?"

Попробуйте этот код js вместо того, что у вас есть. Я добавил функцию задержки, чтобы сценарий ожидал определенное количество времени после того, как пользователь перестает печатать до отправки запроса. Это предотвращает отправку большого количества запросов на сервер.

 <script type="text/javascript"> var delay = (function() { var timer = 0; return function(callback, ms){ clearTimeout (timer); timer = setTimeout(callback, ms); }; })(); $("#search-box").keyup( function () { delay(function () { var keyword = $("#search-box").val(); var URL = encodeURI("search.php?q=" + keyword); $.ajax({ url: URL, cache: false, type: "GET", success: function(response) { $("#results").html(response); } }); }, 500); } ); </script>