Maison  >  Article  >  interface Web  >  Comment définir la valeur par défaut de la liste déroulante de sélection HTML ?

Comment définir la valeur par défaut de la liste déroulante de sélection HTML ?

醉折花枝作酒筹
醉折花枝作酒筹avant
2021-04-26 11:47:287340parcourir

Cet article vous expliquera comment définir la valeur par défaut de la liste déroulante de sélection. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

Comment définir la valeur par défaut de la liste déroulante de sélection HTML ?

Nous pouvons définir la valeur par défaut de l'élément select en utilisant l'attribut "selected" sur l'option souhaitée, qui est un attribut booléen.

Par défaut, la balise d'option avec l'attribut "selected" sera affichée dans la liste déroulante des balises de sélection.

Syntaxe :

<option value="value" selected>选项名称</option>

Exemple 1 : Utilisation de l'attribut sélectionné

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>设置select元素的默认值</title>
	</head>
	<body style = "text-align:center;">  
	    <b>如何设置select元素的默认值?</b> 
	    <p>默认情况下,显示第一个option选项</p> 
	    <select name="plan" id="plan"> 
	        <option value="free">Free</option> 
	        <option value="starter">Starter </option> 
	        <option value="professional">Professional</option> 
	        <option value="corporate">Corporate</option> 
	    </select> 
	    <p>设置Professional选项为默认值</p> 
	    <select name="plan" id="plan"> 
	        <option value="free">Free</option> 
	        <option value="starter">Starter </option> 
	        <option value="professional" selected>Professional</option> 
	        <option value="corporate">Corporate</option> 
	    </select> 
	</body> 
  
</html>

Rendu :

Comment définir la valeur par défaut de la liste déroulante de sélection HTML ?

Exemple 2 : Ajoutez un message du type « Veuillez sélectionner une option » à la liste. Cette option a des propriétés masquées et désactivées en plus d'être cochées.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>设置select元素的默认值</title>
</head>
<body style = "text-align:center;">  
    <p>设置select选项框的默认值</p> 
    <select name="plan" id="plan"> 
        <option value="none" selected disabled hidden>请选择选项</option> 
        <option value="free">Free</option> 
        <option value="starter">Starter </option> 
        <option value="professional">Professional</option> 
        <option value="corporate">Corporate</option> 
    </select>
</body> 
  
</html>

Rendu :

Comment définir la valeur par défaut de la liste déroulante de sélection HTML ?

Apprentissage recommandé : Tutoriel vidéo html

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:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer