Hoe maak je een vervolgkeuzelijst in HTML

De eenvoudigste vervolgkeuzelijst in HTML is eenvoudig te maken met de select-tag. Dit is een containertag, de optietags zijn erin ingesloten; ze specificeren de lijstitems.

Er zijn verschillende opties voor lijsten die u kuntmaak gebruik van de select tag: een drop-down lijst (de opties vallen weg na het klikken op het hoofdveld of de cursor erop) en een meerkeuze lijst - daarin kan de gebruiker verschillende items selecteren. De eerste komen vaker voor, ze vormen een belangrijk element in de navigatie van moderne sites. Er kan een vervolgkeuzelijst met meerdere selecties worden toegepast, bijvoorbeeld in mappen waarin verschillende productkenmerken moeten worden geselecteerd.

U kunt het uiterlijk en de eigenschappen van lijsten wijzigen met behulp van universele en speciale kenmerken.

De kenmerken van de select-tag

1. Meervoudig - stelt de meerkeuze in.

2. Size - specificeert het aantal zichtbare lijnen in de lijst, die de hoogte. En dan is het hangt allemaal af van, meerdere attributen aanwezig is of niet. Als dat zo is, en je hoeft niet size bed opgeeft, in de aanwezigheid van meerdere gebruiker zal al uw opties te zien, maar als er meerdere ontbreekt, is aangetoond dat slechts één lijn te zijn, en de andere gebruiker in staat om te lezen, wanneer om te klikken op het pictogram van de lift aan de rechterkant zal zijn. Als de hoogte van de opgegeven grootte, en het is minder dan het aantal opties aan de rechterkant schuifbalk.

3. Naam is de naam. Een vervolgkeuzelijst kan het zonder doen, maar het kan nodig zijn om te communiceren met een handler op de server. In de regel geeft de naam nog steeds aan.

De select-tag heeft geen verplichte kenmerken, in tegenstelling tot de optielabel.

Attributen van de geneste optielabel

1. Geselecteerd - is voor het markeren van een lijstitem. De gebruiker kan meer dan één item selecteren als het kenmerk Meervoud is opgegeven (zie hierboven).
2. Waarde is de waarde. Dit kenmerk is vereist. De webserver moet begrijpen welke items de gebruiker heeft geselecteerd.
3. Label. Met dit kenmerk kunt u de lijstitems inkorten die te lang zijn. Op het scherm wordt bijvoorbeeld "Milaan" weergegeven in plaats van de optie "Milaan - het administratieve centrum van Lombardije" die is opgegeven in de tag. Noord-Italië ". Dit kenmerk wordt ook gebruikt om items in de lijst te groeperen.

Wat de breedte van de lijst betreft, deze wordt standaard ingesteld op basis van de lengte van de breedste tekst in de lijst. Natuurlijk kan de breedte worden gewijzigd met behulp van HTML-stijlen.

Vervolgkeuzelijst op andere manieren

Het kan bijvoorbeeld worden gedaan met behulp van CSSDe lijst verschijnt als u de cursor op het pagina-element plaatst. Uitstekende kansen voor het maken van lijsten worden geboden door JavaScript, waarvan het werk wordt vereenvoudigd door de Jquery-bibliotheek. Een vervolgkeuzelijst die via deze bibliotheek is verbonden, kan zeer complex zijn, bijvoorbeeld in cascade. Dat wil zeggen, wanneer u een item in één lijst selecteert, verschijnt de volgende lijst, bijvoorbeeld, er is een menu-item "Dameskleding" (wanneer zwevende kledingstukken uitvallen), en vervolgens bij het selecteren van een van de typen, bijvoorbeeld "Bovenkleding", een lijst met elementen: Parken, jassen, korte jassen, bontjassen, enz.

We hebben oppervlakkig de belangrijkste manieren vermeld, methulp waarmee u een vervolgkeuzelijst kunt maken. Natuurlijk zijn er veel nuances in HTML, in CSS en in JavaScript, waarmee je de functionaliteit en het uiterlijk van lijsten kunt wijzigen.