Maison >développement back-end >Problème PHP >Comment implémenter le menu de navigation de gauche en php

Comment implémenter le menu de navigation de gauche en php

PHPz
PHPzoriginal
2023-04-06 09:15:03908parcourir

Dans le développement de sites Web, la mise en œuvre d'un menu de navigation à gauche cliquable est une exigence très courante. Utiliser le langage PHP pour écrire cette fonction est également une méthode efficace et simple.

1. Préparation

Avant de mettre en œuvre le menu de navigation par clic, nous devons préparer quelques conditions de base. Les conditions nécessaires sont énumérées ci-dessous :

1. Le code du langage PHP est requis ;
2. Un système de gestion de base de données (tel que MySQL) est requis ;
3.

Après nous être assuré que les conditions sont remplies, nous pouvons commencer les étapes suivantes.

2. Configurer la table de la base de données

Afin d'implémenter correctement la fonction de clic sur le menu de navigation, nous devons créer une table dans la base de données pour stocker le menu. Voici les exigences des colonnes dans le tableau :

1. ID du menu : l'identifiant unique de chaque élément du menu ;
2. Titre du menu : le titre de chaque menu ;
3. Lien du menu : l'adresse du lien vers d'autres pages Web ;
4. ID du menu de niveau supérieur : à quel menu de niveau supérieur appartient cet élément de menu ;
5. Icône de menu : facultatif, utilisé pour l'esthétique ou le supplément de fonction d'interface.

Après avoir créé le formulaire, nous pouvons l'appeler dans le code PHP pour implémenter la fonction de clic sur le menu de navigation.

3. Implémenter le menu de navigation en PHP

Après avoir conçu la table de la base de données, nous pouvons utiliser le code PHP pour créer ce menu de navigation. Ici, nous utilisons la commande suivante :

$parent_id = 0;
$menu_query = mysql_query("SELECT id, title, link FROM menu WHERE parent_id='".$parent_id."'");
while ($menu_row = mysql_fetch_array($menu_query)) {
echo '

  • '.$menu_row['title'].' ;/li>';
    }
    ?>

    Dans le code ci-dessus, nous définissons d'abord une variable $parent_id, dont la valeur est 0. La signification de cette variable fait référence aux menus "parents" à rechercher. Nous utilisons la fonction mysql_query() pour interroger la table de menu dans la base de données et récupérer les éléments de menu via la fonction mysql_fetch_array().

    En PHP, la conversion de ces éléments de menu en sortie de code HTML est très simple, nous pouvons utiliser la commande echo pour la compléter. Enfin, nous pouvons voir un menu similaire à celui-ci sur l'interface front-end :

    • Accueil
    • À propos de nous
    • Contactez-nous

    Il y a aussi une fonction très importante mysql_query() dans le code ci-dessus, nous devons nous assurer Les valeurs d'entrée de cette fonction sont "sûres". Si les paramètres entrants ne sont pas filtrés, cela peut conduire à des attaques par injection SQL et entraîner des problèmes de sécurité. Un moyen simple d’éviter ce problème consiste à utiliser la fonction addlashes().

    4. Ajouter un événement de clic JavaScript

    Nous avons implémenté le code PHP pour afficher le menu de navigation, nous devons maintenant ajouter un événement de clic JavaScript pour permettre à l'utilisateur de cliquer sur l'élément de menu pour saisir son adresse de lien correspondante. Voici la structure logique du code :

    1 Lorsque l'utilisateur clique sur un élément de menu, la fonction JavaScript déclenchera l'événement
    2 La fonction utilisera l'objet XMLHttpRequest pour envoyer une requête au serveur ; . Le serveur renvoie la page correspondante et restituée dans la fenêtre du navigateur de l'utilisateur.

    Ajoutez les objets JavaScript et XMLHttpRequest en conséquence dans le code. Le code est le suivant :

    <script><p>function displayLink(link) {<br>var xhttp;<br>if (link == "") {<br>document.getElementById( "links_container ").innerHTML = "";<br>return;<br>}<br>xhttp = new XMLHttpRequest();<br>xhttp.onreadystatechange = function() {<br>if (this.readyState == 4 && this.status == 200) { <br>document .getElementById("links_container").innerHTML = this.responseText;<br>}<br>};<br>xhttp.open("GET", link, true);<br>xhttp.send();<br>}<br></script>

    Dans le code ci-dessus, nous avons créé une fonction displayLink() qui envoie un objet XMLHttpRequest lorsqu'un utilisateur clique sur un élément de menu. Lorsque l'état de l'objet XMLHttpRequest renvoyé est 200 (c'est-à-dire que les données ont été obtenues avec succès), nous l'affichons sur la page frontale et le présentons dans la fenêtre du navigateur de l'utilisateur.

    Enfin, en HTML, utilisez la fonction de gestionnaire d'événements onMouseDown et appelez la fonction displayLink() lorsque vous cliquez sur l'élément de menu.

    5. Résumé

    La mise en œuvre d'un menu de navigation à gauche cliquable est très nécessaire pour le développement de sites Web. L'utilisation de PHP peut générer rapidement et dynamiquement des menus de navigation tout en réduisant la quantité de code. JavaScript peut permettre aux utilisateurs d'atteindre rapidement l'adresse du lien cible en cliquant sur le menu.

    Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

  • Déclaration:
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn