Cet article présente le code JavaScript pour implémenter deux options de liste déroulante de sélection pour se déplacer à gauche et à droite. Les étudiants intéressés peuvent se référer à cet article
Je n'ai rien à faire aujourd'hui et j'ai écrit un. liste déroulante avec deux sélections utilisant js. Un petit programme qui peut déplacer des éléments entre les cases. Je viens de commencer à apprendre JavaScript et il reste encore de nombreux domaines à optimiser.
Code Javascript
Le code est le suivant | |
/**Déplacer l'élément sélectionné vers la droite**/ functionmoveRight() { "); varoptionElements = selectElement.getElementsByTagName("option"); varlen = optionElements.length;
if(!(selectElement.selectedIndex==-1)) //Si aucun élément n'est sélectionné, alors selectedIndex est -1 {
//Obtenir le deuxième objet sélectionné varselectElement2 = document.getElementById("secend"); < 🎜> { alert("Vous n'avez pas sélectionné l'élément à déplacer !"); } }
/ /Déplacer tout vers la droite functionmoveAll() { //Obtenir le premier objet sélectionné varselectElement = document.getElementById("first "); varoptionElements = selectElement.getElementsByTagName(" option"); varlen = optionElements.length; //alert(len);
// Retourne le tableau dans le premier sélectionné varfirstOption =newArray(); for(vark=len-1;k>=0;k --) { firstOption. push(optionElements[k]);
} varlens = firstOption.length ; //Obtenir le deuxième objet sélectionné varselectElement2 = document.getElementById("secend"); for(varj=lens-1;j>=0 ;j--) { selectElement2 .appendChild(firstOption[j]); } }
//Déplace l'élément sélectionné vers la gauche functionmoveLeft() { //Obtenir d'abord le deuxième objet sélectionné varselectElement = document.getElementById("secend"); varoptionElement = selectElement.getElementsByTagName("option"); varlen = optionElement.length; //Récupère à nouveau le premier élément if(!(selectElement.selectedIndex==-1)) { varfirstSelectElement = document.getElementById("first"); selectedIndex]);//L'index de l'élément sélectionné } }else { alert("Vous n'avez rien sélectionné à déplacer. projet !"); } } //Déplacer tout vers la gauche functionmoveAllLeft() { varselectElement = document.getElementById ( "secend"); varoptionElements = document.getElementsByTagName("option"); varlen = optionElements.length; varoptionEls =newArray(); for(vari=len-1;i>=0;i--) { optionEls.push(optionElements[i]); } varlens = optionEls.length; varfirstSelectElement = document.getElementById("first"); for(varj=lens-1;j> =0;j- -) { firstSelectElement.appendChild(optionEls[j]); } } |
Ce qui précède est le code javascript, et ce qui suit est le code html plus css.
Code HTML
Le code est le suivant
|
|
||||
Recommandations associées : |
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!