Méthode JavaScript pour contrôler les éléments de la liste pour monter et descendre les compétences Javascript

L'exemple de cet article décrit comment utiliser JavaScript pour contrôler les éléments de la zone de liste afin qu'ils se déplacent de haut en bas. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Ce code JS peut contrôler les éléments de la listbox pour monter ou descendre. Cette fonction est très utile. Voici le code détaillé

Copier le code Le code est le suivant :

function listbox_move(listID, direction) {
var listbox = document.getElementById(listID);
var selIndex = listbox.selectedIndex;
Si(-1 == selIndex) {
alert("Veuillez sélectionner une option à déplacer.");
         revenir ;
>
var incrément = -1;
Si(direction == 'haut')
incrément = -1;
d'autre
incrément = 1;
Si ((incrément de selIndex) (incrément de selIndex) > (listbox.options.length-1)) {
         revenir ;
>
var selValue = listbox.options[selIndex].value;
var selText = listbox.options[selIndex].text;
Listbox.options[selIndex].value = listbox.options[selIndex incrément].value
Listbox.options[selIndex].text = listbox.options[selIndex incrément].text
Listbox.options[incrément selIndex].value = selValue;
Listbox.options[incrément selIndex].text = selText;
Listbox.selectedIndex = incrément selIndex;
>
//..
//..
listbox_move('countryList', 'up'); //monter l'option sélectionnée
listbox_move('countryList', 'down'); //déplacer l'option sélectionnée vers le bas

Vous trouverez ci-dessous le code de démonstration détaillé, qui peut être utilisé dans le navigateur

Copier le code Le code est le suivant :

Cliquez sur les boutons ci-dessous pour sélectionner ou désélectionner toutes les options de la zone de sélection.

   
        Inde
        États-Unis
        Chine
        Italie
        Allemagne
        Canada
        France
        Royaume-Uni
    électionner>

Déplacer vers le haut
Déplacer vers le bas
<script><br /> fonction listboxMove (listID, direction) {<br />     var listbox = document.getElementById(listID);<br />     var selIndex = listbox.selectedIndex;<br />     if(-1 == selIndex) {<br />         alert("Veuillez sélectionner une option à déplacer.");<br />         revenir ;<br />     ><br />     var incrément = -1;<br />     si(direction == 'haut')<br />         incrément = -1;<br />     d'autre<br />         incrément = 1;<br />     if((incrément de selIndex) < 0 ||<br />         (incrément de selIndex) > (listbox.options.length-1)) {<br />         revenir ;<br />     ><br />     var selValue = listbox.options[selIndex].value;<br />     var selText = listbox.options[selIndex].text;<br />     listbox.options[selIndex].value = listbox.options[selIndex incrément].value<br />     listbox.options[selIndex].text = listbox.options[selIndex incrément].text<br />     listbox.options[incrément selIndex].value = selValue;<br />     listbox.options[incrément selIndex].text = selText;<br />     listbox.selectedIndex = incrément selIndex;<br /> ><br /> </script>

希望本文所述对大家的javascript程序设计有所帮助。