Laravel  
laravel
文档
数据库
架构
入门
php技术
    
Laravelphp
laravel / php / java / vue / mysql / linux / python / javascript / html / css / c++ / c#

php动态搜索框代码

作者:仯孒①個亾哋杺¢涳孒   发布日期:2025-06-16   浏览:492

以下是一个简单的PHP动态搜索框代码示例:

<!DOCTYPE html>
<html>
<head>
    <title>动态搜索框</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <style>
        #search_results {
            position: absolute;
            width: 200px;
            background-color: #f9f9f9;
            border: 1px solid #ccc;
            display: none;
        }
        .result {
            padding: 5px;
            cursor: pointer;
        }
        .result:hover {
            background-color: #e9e9e9;
        }
    </style>
</head>
<body>
    <h1>动态搜索框</h1>
    <input type="text" id="search_input" placeholder="请输入关键字">
    <div id="search_results"></div>

    <script>
        $(document).ready(function(){
            $('#search_input').keyup(function(){
                var query = $(this).val();
                if(query != ''){
                    $.ajax({
                        url:"search.php",
                        method:"POST",
                        data:{query:query},
                        success:function(data){
                            $('#search_results').html(data);
                            $('#search_results').css('display', 'block');
                        }
                    });
                }
            });

            $(document).on('click', '.result', function(){
                $('#search_input').val($(this).text());
                $('#search_results').css('display', 'none');
            });

            $(document).on('click', function(){
                $('#search_results').css('display', 'none');
            });
        });
    </script>
</body>
</html>

上述代码中,我们使用了jQuery来处理搜索框的事件。当用户在搜索框中输入关键字时,会触发keyup事件,然后使用AJAX向服务器发送搜索请求,并将搜索结果显示在一个下拉列表中。

在上述代码中,我们使用了一个名为search.php的文件来处理搜索请求,并返回搜索结果。下面是一个简单的search.php文件示例:

<?php
// 连接数据库
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "mydatabase";

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}

// 处理搜索请求
if(isset($_POST["query"])){
    $query = $_POST["query"];

    // 查询数据库中匹配的结果
    $sql = "SELECT * FROM products WHERE name LIKE '%".$query."%'";
    $result = $conn->query($sql);

    // 显示搜索结果
    if ($result->num_rows > 0) {
        while($row = $result->fetch_assoc()) {
            echo "<div class='result'>".$row["name"]."</div>";
        }
    } else {
        echo "无结果";
    }
}

$conn->close();
?>

上述代码中,我们首先连接到数据库,然后根据用户输入的关键字查询匹配的结果,并将结果以HTML的形式返回给前端页面。

请注意,上述代码只是一个简单示例,实际应用中可能需要根据具体需求进行修改和优化。

上一篇:php获取文件类型(php读取文件内容)

下一篇:php 获取子类名

大家都在看

php session用法

phpisset函数

php后端

php爬虫框架

php读取csv文件

php 三元表达式

php文件加密

php 拆分字符串

php pcntl

php ||

Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3

Laravel 中文站