Maison  >  Article  >  interface Web  >  Explication détaillée des événements déclencheurs lorsque l'option spécifiée est sélectionnée dans select

Explication détaillée des événements déclencheurs lorsque l'option spécifiée est sélectionnée dans select

小云云
小云云original
2018-03-17 15:17:5411255parcourir

Lorsque nous utilisons la sélection de la liste déroulante, nous devons déclencher un événement pour l'option 5a07473c87748fb1bf73f23d45547ab8 la méthode onchange dans la sélection.
Si vous souhaitez ajouter un événement déclencheur d'option, ajoutez l'option onclick in mais l'événement ne sera pas déclenché si vous cliquez ici et là.
Ajoutez à nouveau onclick in select C'est génial même si l'option n'est pas sélectionnée. , il sera déclenché
Baidu a dit que l'option ne déclenche pas d'événement et doit ajouter un événement onchange à la sélection...
Lorsque nous déclenchons l'événement double-clic de la sélection, utilisez la méthode ondblclick .
Lorsque nous voulons obtenir l'événement de sélection de select, utilisez document.all['name'].value pour l'obtenir, où name est le nom de select.

Si nous voulons obtenir toutes les valeurs de select, nous pouvons utiliser une boucle for pour y parvenir. Le code est le suivant :

var vi = document.all['list'].length;
for(var i=0;i<vi;i++){
document.form2.list(i).value; //form2是<form>的名称
}
js方法:
‍‍<select id="pid" onchange="gradeChange()">
    <option grade="1" value="a">选项一</a>
    <option grade="2" value="b">选项二</a>
</select>
<script type="text/JavaScript">
       function gradeChange(){
        var objS = document.getElementById("pid");
        var grade = objS.options[objS.selectedIndex].grade;
        alert(grade);
       }
</script>
jq方法:
<select name="myselect" id="myselect">
    <option value="opt1">选项1</option>
    <option value="opt2">选项2</option>
    <option value="opt3">选项3</option>
</select>
 
$("#myselect").change(function(){
    var opt=$("#myselect").val();
    ...
});

Javascript récupère la valeur sélectionnée dans la liste déroulante de sélection
Il y a maintenant une liste déroulante avec id=test, comment obtenir le valeur sélectionnée ?
Utilisez respectivement les méthodes natives javascript et les méthodes jquery

<select id="test"  name="">   
  <option   value="1">text1</option>   
  <option   value="2">text2</option>   
 </select>

1 : Méthodes natives JavaScript
1 : Obtenez l'objet select : var myselect=document.getElementById("test" );
2 : Récupère l'index de l'élément sélectionné : var index=myselect.selectedIndex; // selectedIndex représente l'index de l'élément sélectionné
3 : Récupère la valeur des options de l'élément sélectionné : myselect.options[ index] .value;
4 : Récupère le texte des options de l'élément sélectionné : myselect.options[index].text;
2 : méthode jquery (à condition que la bibliothèque jquery ait été chargée)
1 : options var =$("#test option:selected"); //Obtenir l'élément sélectionné
2:console.log(options.val()); //Obtenir la valeur de l'élément sélectionné
3:console. log (options.text()); //Obtenir le texte de l'élément sélectionné

Recommandations associées :

Comment gérer la superposition d'options de select

Javascript supprime toutes les options dans le partage de code sélectionné

Comment définir la sélection par défaut pour les options de sélection dans 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:
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