suchen

Heim  >  Artikel  >  Backend-Entwicklung  >  So implementieren Sie ein Suchfeld mit PHP

So implementieren Sie ein Suchfeld mit PHP

PHPz
PHPzOriginal
2023-03-22 09:29:561688Durchsuche

Auf modernen Websites ist ein nützliches Suchfeld unverzichtbar. Diese Funktion kann den Suchvorgang des Benutzers erheblich vereinfachen und das Benutzererlebnis der Website verbessern. Das Hinzufügen eines Eingabeaufforderungsfelds neben dem Suchfeld bringt die Sucheffizienz des Benutzers auf ein neues Niveau. In diesem Artikel erfahren Sie, wie Sie mit PHP eine Suchfeld-Eingabeaufforderungsfunktion implementieren.

1. Implementierungsprinzip

Bei der Implementierung des Suchfelds in PHP müssen wir die AJAX-Technologie verwenden. Es ist im Wesentlichen in die folgenden Schritte unterteilt:

  1. Der Benutzer gibt den Suchbegriff in das Suchfeld ein.
  2. Senden Sie Schlüsselwörter an serverseitige PHP-Skripte.
  3. Erhalten Sie auf der Serverseite Suchergebnisse zu Schlüsselwörtern, indem Sie die Datenbank oder andere Datenquellen abfragen.
  4. Kapseln Sie die Suchergebnisse im JSON-Datenformat und geben Sie sie an den Client zurück.
  5. Nachdem der Client die vom Server zurückgegebenen Daten erhalten hat, verwendet er JavaScript, um diese unterhalb des Suchfelds anzuzeigen und ein Suchfeld zu bilden.

2. Implementierungsschritte

  1. Datenbanktabelle erstellen

Wir erstellen zunächst eine Produkttabelle mit dem Namen products, die die folgenden Felder enthält: products 的商品表，包含以下字段：

id          int(11)         商品 ID
name        varchar(255)    商品名称
description text            商品描述
price       decimal(10,2)   商品价格
  1. 编写数据库查询函数

我们需要编写一个 query() 函数去连接数据库并执行查询，返回结果数组。示例如下：

<?php
function query($query) {
    $database = new PDO(&#39;mysql:host=localhost; dbname=database_name&#39;, &#39;database_user&#39;, &#39;database_password&#39;);
    $database->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $stmt = $database->prepare($query);
    $stmt->execute();
    return $stmt->fetchAll(PDO::FETCH_ASSOC);
}
?>
  1. 编写搜索提示框逻辑

实现搜索框提示框逻辑的代码如下：

<?php
$keyword = $_GET[&#39;keyword&#39;];
if ($keyword) {
    $result = query("SELECT name FROM products WHERE name LIKE &#39;%$keyword%&#39; LIMIT 5");
    $data = array();
    foreach ($result as $row) {
        $data[] = $row[&#39;name&#39;];
    }
    echo json_encode($data);
}
?>

以上代码执行如下操作：

  • 从 GET 请求中获取搜索关键字。

  • 查询数据库中与关键字匹配的前 5 个商品名称，并将结果保存在 $data 数组中。

  • 将数据编码成 JSON 格式并返回给客户端。

  • 编写客户端代码

实现搜索框提示框显示的客户端代码如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>PHP 搜索框提示框实例</title>
    <script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
    <input type="text" id="search-box" placeholder="请输入搜索关键字">
    <div id="search-result"></div>
    <script>
        $(document).ready(function() {
            $('#search-box').keyup(function() {
                var keyword = $(this).val();
                $.ajax({
                    url: 'search.php',
                    type: 'GET',
                    dataType: 'json',
                    data: {keyword: keyword},
                    success: function(data) {
                        var html = '';
                        for (var i = 0; i < data.length; i++) {
                            html += &#39;<div>' + data[i] + '</div>';
                        }
                        $('#search-result').html(html);
                    },
                    error: function() {
                        $('#search-result').html('无法获取数据！');
                    }
                });
            });
        });
    </script>
</body>
</html>

以上代码执行如下操作：

  • 监听搜索框输入事件。

  • 获取搜索框输入关键字并发送 AJAX 请求到 search.phprrreee

      Datenbankabfragefunktion schreiben

  • Wir müssen eine query()-Funktion schreiben, um eine Verbindung zur Datenbank herzustellen, die Abfrage auszuführen und das Ergebnisarray zurückzugeben. Ein Beispiel lautet wie folgt:

    rrreee
      1. Schreiben Sie die Logik des Suchfelds für Eingabeaufforderungen

    Der Code zum Implementieren der Logik des Suchfelds für Eingabeaufforderungen lautet wie folgt: rrreee

    Der obige Code führt die folgenden Vorgänge aus:

      🎜Suchbegriffe aus GET-Anfrage abrufen. 🎜🎜🎜🎜Fragen Sie die fünf Produktnamen ab, die am häufigsten mit dem Schlüsselwort in der Datenbank übereinstimmen, und speichern Sie die Ergebnisse im Array $data. 🎜🎜🎜🎜Kodieren Sie die Daten in das JSON-Format und geben Sie sie an den Client zurück. 🎜🎜🎜🎜Client-Code schreiben🎜🎜🎜🎜Der Client-Code zum Implementieren der Anzeige des Suchfeld-Eingabeaufforderungsfelds lautet wie folgt: 🎜rrreee🎜Der obige Code führt die folgenden Vorgänge aus: 🎜
        🎜 🎜Suchfeld-Eingabeereignisse abhören. 🎜🎜🎜🎜Rufen Sie das Suchfeld auf, um Schlüsselwörter einzugeben und AJAX-Anfragen an search.php zu senden. 🎜🎜🎜🎜Zeigen Sie die von AJAX zurückgegebenen Daten im Suchfeld an. 🎜🎜🎜🎜🎜 3. Zusammenfassung🎜🎜🎜Durch die oben genannten Schritte haben wir erfolgreich eine Suchfeld-Eingabeaufforderungsfunktion implementiert. Der Benutzer gibt Schlüsselwörter in das Suchfeld ein und die Webseite sendet die Schlüsselwörter über die AJAX-Technologie an den Server. Der Server fragt die Datenbank anhand der Schlüsselwörter ab und gibt die passenden Ergebnisse an die Webseite zurück in Form eines Suchfelds, das ein hervorragendes Benutzersucherlebnis ermöglicht. Wir können diese spezifische Implementierungsmethode flexibel an den tatsächlichen Bedarf anpassen, um die besten Ergebnisse zu erzielen. 🎜

    Das obige ist der detaillierte Inhalt vonSo implementieren Sie ein Suchfeld mit PHP. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    Stellungnahme：
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Vorheriger Artikel：So führen Sie einen Typvergleich in PHP durchNächster Artikel：So führen Sie einen Typvergleich in PHP durch

    In Verbindung stehende Artikel

    Mehr sehen