Question

我已经创建了自动完成功能，但是它不起作用。我没有看到错误，也找不到错误所在...

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);

?>

有人可以建议我如何解决它吗？一无所知，一遍一遍地搜索了整个互联网和所有代码行，但没有看到错误...

Answer 1

已修复...问题是在Mac上使用“ localhost”而不是“ 127.0.0.1”。尝试创建新的.php文件并通过webbrowser访问该文件时，不小心遇到了它。

自动完成功能不起作用。...（AJAX + PHP + HTML + JS）

1 个答案: