php怎么设置自定义菜单

在PHP开发过程中，为网站设置自定义菜单是提高用户体验的重要一环，本文将详细介绍如何在PHP中创建自定义菜单，包括数据库设计、后端逻辑处理和前端展示，以下是具体的操作步骤，希望能帮助到有需要的开发者。

数据库设计

我们需要设计一个用于存储菜单信息的数据库表，以下是一个简单的表结构设计：

1、menu（菜单表）

字段名	类型	说明
id	int	菜单ID，主键，自增
name	varchar(50)	菜单名称
parent_id	int	父菜单ID，0表示顶级菜单
url	varchar(255)	菜单链接
sort	int	菜单排序，数字越小越靠前

创建数据库连接及操作类

我们需要创建一个数据库连接及操作类，用于对菜单表进行增删改查操作，以下是一个简单的示例：

<?php
class Db {
    private static $instance = null;
    private $conn;
    private function __construct() {
        // 连接数据库
        $this->conn = new mysqli('localhost', 'username', 'password', 'database');
    }
    public static function getInstance() {
        if (self::$instance == null) {
            self::$instance = new self();
        }
        return self::$instance;
    }
    public function query($sql) {
        return $this->conn->query($sql);
    }
}

实现菜单的增删改查操作

1、查询菜单列表

function getMenuList() {
    $db = Db::getInstance();
    $sql = "SELECT * FROM menu ORDER BY sort ASC";
    $result = $db->query($sql);
    $menuList = [];
    while ($row = $result->fetch_assoc()) {
        $menuList[] = $row;
    }
    return $menuList;
}

2、添加菜单

function addMenu($name, $parent_id, $url, $sort) {
    $db = Db::getInstance();
    $sql = "INSERT INTO menu (name, parent_id, url, sort) VALUES ('$name', $parent_id, '$url', $sort)";
    return $db->query($sql);
}

3、修改菜单

function updateMenu($id, $name, $parent_id, $url, $sort) {
    $db = Db::getInstance();
    $sql = "UPDATE menu SET name='$name', parent_id=$parent_id, url='$url', sort=$sort WHERE id=$id";
    return $db->query($sql);
}

4、删除菜单

function deleteMenu($id) {
    $db = Db::getInstance();
    $sql = "DELETE FROM menu WHERE id=$id";
    return $db->query($sql);
}

前端展示

在完成后端逻辑后，我们需要在前端展示菜单，以下是一个简单的HTML和PHP结合的示例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>自定义菜单</title>
</head>
<body>
    <ul>
        <?php
        $menuList = getMenuList();
        foreach ($menuList as $menu) {
            echo '<li><a href="' . $menu['url'] . '">' . $menu['name'] . '</a></li>';
        }
        ?>
    </ul>
</body>
</html>

动态创建菜单

在某些情况下，我们可能需要动态创建菜单，以下是一个使用JavaScript和AJAX的示例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>动态创建菜单</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
    <ul id="menu">
    </ul>
    <script>
        $(document).ready(function() {
            $.ajax({
                url: 'getMenuList.php', // 请求后端获取菜单列表的文件
                type: 'GET',
                success: function(data) {
                    var menuList = JSON.parse(data);
                    for (var i = 0; i < menuList.length; i++) {
                        $('#menu').append('<li><a href="' + menuList[i].url + '">' + menuList[i].name + '</a></li>');
                    }
                }
            });
        });
    </script>
</body>
</html>

在上述示例中，我们使用jQuery发起AJAX请求，从后端获取菜单列表，然后动态创建HTML元素并插入到页面中。