Méthode JavaScript pour contrôler le mouvement de haut en bas des éléments dans Listbox Listbox

Cet article décrit la méthode de JavaScript pour contrôler le mouvement de haut en bas des éléments dans une zone de liste de lisbox. Partagez-le pour votre référence. L'analyse spécifique est la suivante:

Ce code JS peut contrôler les éléments dans Listbox pour monter ou descendre, ce qui est très utile. Vous trouverez ci-dessous le code détaillé

La copie de code est la suivante: fonction listbox_move (listId, direction) {

var listbox = document.getElementById (listId);

var seLindex = listbox.selectedIndex;

if (-1 == Selindex) {

alert ("Veuillez sélectionner une option de déplacement.");

retour;

}

var incrément = -1;

if (direction == 'up')

incrément = -1;

autre

incrément = 1;

if ((Selindex + incrément) <0 ||

(Selindex + incrément)> (listbox.options.length-1)) {

retour;

}

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 [Selindex + incrément] .value = selvalue;

listbox.options [Selindex + incrément] .text = seltext;

listbox.selectedIndex = Selindex + incrément;

}

// ..

// ..

listbox_move ('countrylist', 'up'); // Montez l'option sélectionnée

listbox_move ('countrylist', 'down'); // descendez l'option sélectionnée

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

Copiez le code comme suit: Cliquez sur les boutons ci-dessous pour sélectionner ou désélectionner toutes les options dans la zone de sélection. <br>

<select id = "lsbox" name = "lsbox" size = "10" multiple = "">

<Option Value = "1"> Inde </opoption>

<Option Value = "2"> États-Unis </ Option>

<Option Value = "3"> Chine </ Option>

<Option Value = "4"> Italie </ Option>

<Option Value = "5"> Allemagne </opoption>

<Option Value = "6"> Canada </ Option>

<Option Value = "7"> France </ Option>

<Option Value = "8"> Royaume-Uni </ Option>

</lect> <br>

<bouton onclick = "listboxmove ('lsbox', 'up');"> se déplacer vers le haut </fontificateur>

<bouton onclick = "listboxmove ('lsbox', 'down');"> Déplacez-vous </futch>

<cript>

fonction listboxmove (listId, direction) {

var listbox = document.getElementById (listId);

var seLindex = listbox.selectedIndex;

if (-1 == Selindex) {

alert ("Veuillez sélectionner une option de déplacement.");

retour;

}

var incrément = -1;

if (direction == 'up')

incrément = -1;

autre

incrément = 1;

if ((Selindex + incrément) <0 ||

(Selindex + incrément)> (listbox.options.length-1)) {

retour;

}

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 [Selindex + incrément] .value = selvalue;

listbox.options [Selindex + incrément] .text = seltext;

listbox.selectedIndex = Selindex + incrément;

}

</cript>

J'espère que cet article sera utile à la programmation JavaScript de tous.