Сценарии JavaScript в активных страницах Web

Динамическое заполнение списка


Сценарий JavaScript может изменять список, добавляя в него новые элементы. Пример такого сценария мы уже приводили в разделе второй главы с названием “Ссылки и метки в документе”. Мы предлагаем вам обратиться к этому разделу еще раз.

Напомним, что там мы создали в документе HTML пустой список с именем ListOfLinks, расположив его в форме Sel:

<FORM NAME="Sel">

      <SELECT NAME="ListOfLinks">

      </SELECT>

      <INPUT TYPE="button" VALUE="Jump!"  

         onClick="urlJump();">

</FORM>

Перед заполнением этого списка мы создали массив элементов elem:

elem = new Array();

Заполнение этого массива выполнялось в цикле, причем для создания элемента массива мы вызывали конструктор Option, задавая для него четыре параметра:

elem[i] = new Option("Elem" + i, i, false, false);

Первый параметр задает текст, который отображается в списке, второй - значение, назначаемое элементу списка при помощи параметра VALUE. Третий и четвертый параметры соответствуют свойствам, соответственно, defaultSelected и selected.



Переменная i - это параметр цикла, изменяющий свое значение от нуля и до количества элементов, добавляемых в список.

После того как элемент списка создан как объект класса option, его нужно записать в соответствующий элемент массива options:

Sel.ListOfLinks.options[i] = elem[i];

Sel.ListOfLinks.options[i].text = document.links[i];

Здесь мы также дополнительно устанавливаем значение для свойства text элемента этого массива, записывая текст, который должен отображаться в списке.

Определение выбранного из нашего списка элемента выполняется аналогично тому, как это сделано в предыдущем примере:

function urlJump()

{

  var szNewURL="";

  szNewURL =       

    document.links[Sel.ListOfLinks.selectedIndex];

  window.location.href=szNewURL;

}

Вначале мы определяем номер выбранного элемента как значение Sel.ListOfLinks.selectedIndex. Затем это значение используется как индекс в массиве document.links, из которого в цикле происходило заполнение нашего списка.



Содержание раздела