自动完成不起作用.... (AJAX+PHP+HTML+JS)答案

【问题标题】：Autocomplete doesn't work.... (AJAX+PHP+HTML+JS)自动完成不起作用.... (AJAX+PHP+HTML+JS)
【发布时间】：2018-08-28 09:28:58
【问题描述】：

我创建了自动完成功能，但它不起作用。我没有看到任何错误，也无法找出问题所在......

HTML：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">

    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Metamorphous">
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

    <script src ="scripts.js"></script>
</head>
<body>
    <div id="container">
        <div id="main" class="down">
                <header>
                    <h1>HerbariuM</h1>
                </header>
                <nav>
                    <input id="searchBar" type="text" placeholder="Szukaj..." onfocus="mainUp()" onblur="mainDown()">
                </nav>
        </div>
        <div id="herb" class="hide">
            <img id="image" src="">
            <h2><i>Losowa roślinka</i></h2>
        </div>
    </div>
</body>
</html>

这里只是自动完成的代码片段JS：

$(document).ready(function(){
$("#searchBar").autocomplete({
    source: function(request,response){
        $.ajax({
            url: "search.php",
            dataType:"json",
            data:{q:request.term},
            success: function(data){
                response(data);
            }
        });
    },
    minLength: 2,
    select: function(event,ui){
        alert("Selected: "+ui.item.label);
    }
});
});

这是从数据库返回数据的 PHP 代码 PHP:

<?php

$connection = new mysqli("localhost","root","password","herbarium");

$herb = $_GET['q'];

$result = $connection->query("SELECT * FROM herbs WHERE latin_name LIKE '%$herb%'");

$data = array();

while ($row=$result->fetch_assoc()){
    $data[] = $row['latin_name'];
}

echo json_encode($data);

?>

谁能建议我如何解决它？不知道，一一搜索了整个互联网和所有代码行，但没有发现错误...

【问题讨论】：

调试时，它是如何/在哪里失败的？当您在执行代码时单步执行代码时，哪个特定操作首先会产生意外结果？该操作的输入是什么？结果如何？你期待什么结果？为什么？（另请注意，您的代码对 SQL 注入非常开放，并且您没有检查数据库错误。）
请添加更多关于它如何不起作用的细节：你的函数是否被调用，请求是否发送到正确的地址，请求是否在后端得到处理等等。
嗯...在 searchBar 中写入前 2 个字母后，它应该显示基于 'herbarium' 数据库中 mysql 表 'herbs' 的自动建议...它是基于 arielmax.com/38-cursos-de-jquery-jquery-ui 完成的，但他的作品.控制台没有显示任何错误...我知道还没有保护，将添加
添加断点，看看你的代码到底在哪里中断。
@farmaceut：“它不起作用”并不是真正有用的调试信息。这是您开始熟悉调试概念的机会。使用浏览器的调试工具。在代码执行时单步执行代码，观察 HTTP 请求和响应，观察变量的运行时值等。此外，PHP 错误不会显示在控制台上。检查您的 PHP 日志是否有错误，打开错误报告等。同样，您也对 SQL 注入持开放态度，而不是检查数据库错误。它可能会非常响亮地失败，而你没有在听。

标签： javascript php jquery html mysql

【解决方案1】：

已修复...问题是在我的 Mac 上使用“localhost”而不是“127.0.0.1”。在尝试创建新的 .php 文件并通过 webbrowser 访问它时意外出现。

【讨论】：