Динамическое заполнение списка
Сценарий 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, из которого в цикле происходило заполнение нашего списка.