php - 使用 MySQL、PHP 和 AJAX 进行实时搜索无法正常工作

标签 php jquery mysql ajax livesearch

好的,我正在尝试使用 PHP、MySQL 和 AJAX 进行实时搜索。我不确定我是否走错了。我的数据库托管在 phpMyAdmin 上。数据库名称是Info,我尝试访问的表是names。

我的三个页面是index.php connect.php和fetch.php 索引.php

<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
        <style>

            #here
                {
                    width:400px;
                    height:300px;
                    border: 1px solid grey;
                    display:none;
                }

            #here a{
                display:block;
                width:98%;
                padding:1%;
                font-size:20px;
                border-bottom:1px solid grey;
            }

                </style>
        <body>

            <script src=jq.js></script>

            <script src="jq.js">
                $(document).ready(function(e)
                {
                    $("search").keyup(function()
                    {
                        $("#here").show();
                        var x = $(this).val();
                        $.ajax(
                            {
                                type:'GET',
                                url:'fetch.php',
                                data: 'q='+x,
                                success:function(data)
                                {
                                    $("#here").html(data);
                                }
                                ,
                            });
                    });
                });




            </script>


            <h1>Live Search</h1>
            <input type="search" name="search" id="search">
            <div id="here">

            </div>
        </body>
</html>

获取.php

<?php
if(!empty($_GET['q']))
{

    include 'connect.php';
    $q=$_GET['q'];
    $query = "select * from names where names like '%$q%';";
    while($output=mysqli_fetch_assoc($result))
    {
        echo '<a>'.$output['names'].'</a>';
    }
     $query = "select * from names";
}

获取.php

    ?>

<?php
$host="localhost";
$user="andremac96";
$password="";
$db="Info";
$conn = mysqli_connect($host,$user,$password,$db);
?>

最佳答案

这里有一些问题。

首先,您从未执行过以下查询:

$query = "select * from names where names like '%$q%';";

因此,您需要包含 mysqli_query()并将数据库连接传递给它。

$query = mysqli_query($conn, "select * from names where names like '%$q%';");

那么,您就会使用错误的变量 $result对于

while($output=mysqli_fetch_assoc($result))

应该是$query ,但是再说一次;也查询它。

$query = "select * from names"; 也是如此

$query = mysqli_query($conn, "select * from names");

^ 但不确定你想用它做什么。

然后你忘了输入 #对于 $("search").keyup(function() 中的搜索 ID应该读作:

$("#search").keyup(function()

检查 PHP 和 MySQL 上的错误:

另外,检查你的 JS 控制台。

然后是echo '<a>'.$output['names'].'</a>';

^ 也不确定您想在这里做什么。

然后是第二个<script src="jq.js">应该读作 <script> .

<小时/>

您当前的代码已开放给 SQL injection 。使用prepared statements ,或PDOprepared statements .

<小时/>

HTML 贴纸

地点 <style>...</style>里面<head></head> 。某些浏览器会在 HTML 源代码中抛出警告。

<小时/>

编辑:(重写我使用的测试成功的内容)。

旁注:我添加了<form></form>标签,但没有它们也能工作。

文件#1:

<!DOCTYPE html>
<html>
    <head>
        <title></title>

<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>

        <style>

            #here
                {
                    width:400px;
                    height:300px;
                    border: 1px solid grey;
                    display:none;
                }

            #here a{
                display:block;
                width:98%;
                padding:1%;
                font-size:20px;
                border-bottom:1px solid grey;
            }

                </style>

    </head>

        <body>


            <script>
                $(document).ready(function(e)
                {
                    $("#search").keyup(function()
                    {
                        $("#here").show();
                        var x = $(this).val();
                        $.ajax(
                            {
                                type:'GET',
                                url:'fetch.php',
                                data: 'q='+x,
                                success:function(data)
                                {
                                    $("#here").html(data);
                                }
                                ,
                            });
                    });
                });


            </script>


<h1>Live Search</h1>
<form>
    <input type="search" name="search" id="search">
</form>

    <div id="here">

    </div>


        </body>
</html>

文件 #2: (fetch.php)

<?php 

 include 'connect.php'; // being the MySQLi_ API

if(!empty($_GET['q']))
{


$q= mysqli_real_escape_string($conn, $_GET['q']);


    $query = mysqli_query($conn, "select * from names where names like '%$q%';") 
             or die(mysqli_error($conn));


    while($output=mysqli_fetch_assoc($query))
    {

        echo '<a>'.$output['names'].'</a>';


    }
//     $query = "select * from names";
}
  • 确保您的 .php文件路径正确并且您的脚本可以访问它们。

添加error reporting到文件顶部,这将有助于查找错误。

<?php 
error_reporting(E_ALL);
ini_set('display_errors', 1);

// Then the rest of your code

旁注:显示错误只能在暂存阶段进行,而不能在生产阶段进行。

关于php - 使用 MySQL、PHP 和 AJAX 进行实时搜索无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36656448/

相关文章:

javascript - 如果客户端先运行,asp.net mvc 5 应该运行服务器端验证

php - 带有 mysql 和 pgp 的 jquery 选项卡

mysql - 在 Django 中,我可以在检索查询集之前在序言中设置变量吗?

PHP PDO : Unable to connect, 目录名称无效

php - 推送通知到客户端浏览器

javascript - typeahead 不会处理所有的 Bloodhound 结果

jQuery 反向展开

mysql - 向现有 MySQL 表添加包含表名 + 增量的列

javascript - 将 span 标签中的值插入 SQL 数据库

php - Google 群组和订阅代码