interface Webtutoriel CSSComment puis-je simuler la fonctionnalité d'une case à cocher dans un menu déroulant de sélection ?
Implémentation de la fonctionnalité de case à cocher dans les menus d'options de sélection
Malgré l'impossibilité d'inclure nativement des cases à cocher dans les menus d'options de sélection, il existe une solution de contournement intelligente utilisant HTML , CSS et JavaScript.
Code Implémentation :
-
HTML :
- Créez un formulaire contenant un div à sélection multiple avec une liste déroulante "Sélectionner une option".
- Définissez un div caché nommé "checkboxes" contenant des étiquettes de cases à cocher individuelles en utilisant l'attribut for pour les lier à leur cases à cocher.
-
CSS :
- Stylez les éléments multiselect, selectBox, overSelect et checkboxes pour l'apparence souhaitée et flotter effets.
-
JavaScript :
- Définissez une fonction showCheckboxes() pour basculer la visibilité des cases à cocher div en cliquant sur le selectBox.
Explication :
Le div multisélection fait office de menu d'options de sélection. Lorsqu'elle est cliquée, la fonction showCheckboxes() affiche ou masque les cases à cocher div. Chaque étiquette de case à cocher représente une option dans la liste déroulante. Le survol d'une étiquette la surligne dans une couleur différente, fournissant un retour visuel similaire à une case à cocher cochée.
Remarque :
Bien que cette solution permette une fonctionnalité de case à cocher dans les menus d'options de sélection, il ne fournit pas les fonctionnalités d'accessibilité natives des éléments de case à cocher.
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!
Mise à jour 'CSS4'Apr 11, 2025 pm 12:05 PMDepuis que j'ai sonné pour la première fois sur le truc CSS4¹, il y a eu des tonnes de discussions plus à ce sujet. Je vais rassembler mes pensées préférées des autres ici. Il y a
Les trois types de codeApr 11, 2025 pm 12:02 PMChaque fois que je commence un nouveau projet, j'organise le code que je regarde en trois types ou catégories si vous le souhaitez. Et je pense que ces types peuvent être appliqués à
HTTPS est facile!Apr 11, 2025 am 11:51 AMJ'ai été coupable de déplorer publiquement la complexité des HTTP. Dans le passé, j'ai acheté des certificats SSL à des fournisseurs tiers et j'ai eu des problèmes
Guide des attributs de données HTMLApr 11, 2025 am 11:50 AMTout ce que vous avez toujours voulu savoir sur les attributs de données dans HTML, CSS et JavaScript.
Comprendre l'immuabilité en JavaScriptApr 11, 2025 am 11:47 AMSi vous n'avez pas travaillé avec l'immuabilité en JavaScript auparavant, vous pourriez trouver facile de le confondre avec l'attribution d'une variable à une nouvelle valeur ou une réaffectation.
Entrées de formulaire de style personnalisé avec des fonctionnalités CSS modernesApr 11, 2025 am 11:45 AMIl est tout à fait possible de créer des cases à cocher personnalisées, des boutons radio et des interrupteurs à bascule ces jours-ci, tout en restant sémantique et accessible. Nous n'avons même pas besoin d'un
Personnages de note de bas de pageApr 11, 2025 am 11:34 AMIl existe des caractères de numéro de sur-ensemble spéciaux qui sont parfois parfaits pour les notes de bas de page. Les voici:
Comment créer un compte à rebours animé avec HTML, CSS et JavaScriptApr 11, 2025 am 11:29 AMAvez-vous déjà eu besoin d'un compte à rebours sur un projet? Pour quelque chose comme ça, il pourrait être naturel d'atteindre un plugin, mais c'est en fait beaucoup plus
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
AI Hentai Generator
Générez AI Hentai gratuitement.
Article chaud
Outils chauds
mPDF
mPDF est une bibliothèque PHP qui peut générer des fichiers PDF à partir de HTML encodé en UTF-8. L'auteur original, Ian Back, a écrit mPDF pour générer des fichiers PDF « à la volée » depuis son site Web et gérer différentes langues. Il est plus lent et produit des fichiers plus volumineux lors de l'utilisation de polices Unicode que les scripts originaux comme HTML2FPDF, mais prend en charge les styles CSS, etc. et présente de nombreuses améliorations. Prend en charge presque toutes les langues, y compris RTL (arabe et hébreu) et CJK (chinois, japonais et coréen). Prend en charge les éléments imbriqués au niveau du bloc (tels que P, DIV),
DVWA
Damn Vulnerable Web App (DVWA) est une application Web PHP/MySQL très vulnérable. Ses principaux objectifs sont d'aider les professionnels de la sécurité à tester leurs compétences et leurs outils dans un environnement juridique, d'aider les développeurs Web à mieux comprendre le processus de sécurisation des applications Web et d'aider les enseignants/étudiants à enseigner/apprendre dans un environnement de classe. Application Web sécurité. L'objectif de DVWA est de mettre en pratique certaines des vulnérabilités Web les plus courantes via une interface simple et directe, avec différents degrés de difficulté. Veuillez noter que ce logiciel
Listes Sec
SecLists est le compagnon ultime du testeur de sécurité. Il s'agit d'une collection de différents types de listes fréquemment utilisées lors des évaluations de sécurité, le tout en un seul endroit. SecLists contribue à rendre les tests de sécurité plus efficaces et productifs en fournissant facilement toutes les listes dont un testeur de sécurité pourrait avoir besoin. Les types de listes incluent les noms d'utilisateur, les mots de passe, les URL, les charges utiles floues, les modèles de données sensibles, les shells Web, etc. Le testeur peut simplement extraire ce référentiel sur une nouvelle machine de test et il aura accès à tous les types de listes dont il a besoin.
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
MinGW - GNU minimaliste pour Windows
Ce projet est en cours de migration vers osdn.net/projects/mingw, vous pouvez continuer à nous suivre là-bas. MinGW : un port Windows natif de GNU Compiler Collection (GCC), des bibliothèques d'importation et des fichiers d'en-tête librement distribuables pour la création d'applications Windows natives ; inclut des extensions du runtime MSVC pour prendre en charge la fonctionnalité C99. Tous les logiciels MinGW peuvent fonctionner sur les plates-formes Windows 64 bits.
