2015-05-13
547
<HTML>
<HEAD>
<TITLE>Выбор изображения из списка</TITLE>
<script>
<!-—
function ref(obj)
{ obj.pict.value='0'
ch_pict(0)
obj.res.value=''
obj.mypict.src="pictureO.gif"
}
function ch_pict(num)
{ var d=document
switch (num)
{ case "0" d.mypict.src="pictureO.gif" break;
case "1" d.mypict.src="picturel.gif" break;
case "2" d.mypict.src="picture2.gif" break;
case "3" d.mypict.src="picture3.gif" break;
case "4" d.mypict.src="picture4.gif" break;
case "5" d.mypict.src="picture5.gif" break;
case "6": d.mypict.src="picture6.gif"; break;
}
form1.res.value=nunr*100
)
//-->
</script>
</HEAD>
<BODY bgcolor="#eaf5ef">
<Н3>Выбор рисунка</Н3>
<FORM name="form1">
<TABLE border=1>
<TR>
<TD>
<select name="pict" size="7"
onChange="ch_pict(forml.pict.value)">
<option value="0">HeT
<option value="l">Дом
<option value="2">Книги
<option value="3">Письмо
<option value="4">Краски
<option value="5">Bonpoc
<option value="6">Дерево
</select>
</TD>
<TD><IMG src="picture0.gif" name="mypict" width=100></TD></TR>
</TABLE>
<br>
Стоимость: <input type="text" name="res" size=12><P>
<input type="button" value="Обновить" onClick="ref(form1)">
</FORM>
</BODY>
</HTML>
В приведенном примере считается, что файлы с изображением хранятся в той же папке, что и создаваемый HTML-документ. Если это не так, то в правой части операторов присваивания оператора switch следует указать полное имя файла с изображением. Тот факт, что выбранное название рисунка и имя графического файла с изображением связаны значением параметра value тега <option>, позволяет сократить текст программы и описать функцию ch_pict следующим образом:
function ch_pict(num)
{ var d=document
d.mypict.src="picture"+num+".gif"
form1.res.value=num*100
}
Имя файла изображения формируется в виде строки; значение num определяет по названию имя файла с изображением.
В документе лишь одно изображение, поэтому для доступа к объекту image на странице можно воспользоваться конструкцией document.images [0]. Функция chjpict в этом случае может быть описана следующим образом.
function ch_pict(num)
(var d=document
d.images[0].src="picture"+num+".gif"
form1.res.value=num*100
}
Изменение свойств горизонтальной линии
Напишем сценарий, при выполнении которого горизонтальная линия представлена в документе с заданными параметрами. Предусмотрите возможность изменения цвета линии. После задания параметров выравнивания, длины, толщины и цвета линии документ примет вид, как на рис. 6.5. Определим в виде списка название цветов для горизонтальной линии, которые может задать пользователь. При выборе цвета реакцией на событие change будет вызов функции gr (forml, forml.col.value) с двумя параметрами. Первый параметр необходим, чтобы получить доступ к элементам документа, а второй указывает значение выбранного элемента в списке цветов. По последнему параметру определяется название цвета. Функцию gr можно упростить, если в качестве значения параметра value тега <option> задать название цвета.
Доступ к свойствам, определяющим горизонтальную линию, осуществляется с помощью параметра id. HTML-код, содержащий требуемый сценарий, представлен в листинге 6.7.
