Обработка события Focus
Напишем сценарий, определяющий площадь квадрата по заданной стороне. Площадь должна вычисляться в тот момент, когда пользователь переходит к эле менту формы с помощью щелчка мыши. Вызов функции произойдёт как реакция на событие Focus, параметр обработки события onFocus.
(dmi8)
<html>
<head>
<title>dmi8</title>
<script>
function srec()
{form1.res.value=form1.num1.value*form1.num1.value}
</script>
</head>
<body>
<p>ssss</p>
<form name="form1">
OOOO: <input type="text" size=7 name="num1" value=6
onFocus="srec()"><hr>
VVVV: <input type="text" size=7 name="res"><hr>
<input type="reset" value=Обновить>
</form>
</body>
</html>
Обработка события Blur
Событие "потеря фокуса" (Blur) происходит в тот момент, когда элемент формы теряет фокус. Напишем сценарий, определяющий площадь квадрата по заданной стороне. Площадь должна вычисляться в тот момент, когда элемент формы теряет фокус. В результате потери фокуса полем num1 происходит вычисление значения площади и помещение вычисленнрго значения в поле res. Первоначально будет вычислен результат, равный 64. Можно ввести нужное значение и при переходе к другому любому элементу, в поле res отобразится вычисленное значение.
(dmi9)
<html>
<head>
<title>dmi9</title>
<script>
function srec()
{form1.res.value=form1.num1.value*form1.num1.value}
</script>
</head>
<body>
<p>ssss</p>
<form name="form1">
OOOO: <input type="text" size=7 name="num1" value=8
onBlur="srec()"><hr>
VVVV: <input type="text" size=7 name="res"><hr>
<input type="reset" value=Обновить>
</form>
</body>
</html>
Обработка события Select
Событие Select вызывается выбором части или всего текста в текстовом поле. Например, щёлкнув дважды по полю num1, мы выделим поле, наступит событие Select, обработка которого приведёт к вычислению требуемого значения. Напишем сценарий, определяющий площадь квадрата по заданной стороне. Площадь должна вычислятся в тот момент, когда выбирается часть или весь текст в текстовом поде.
(dmi10)
<html>
<head>
<title>dmi10</title>
<script>
function srec()
{form1.res.value=form1.num1.value*form1.num1.value}
</script>
</head>
<body>
<p>ssss</p>
<form name="form1">
OOOO: <input type="text" size=7 name="num1" value=9
onSelect="srec()"><hr>
VVVV: <input type="text" size=7 name="res"><hr>
<input type="reset" value=Обновить>
</form>
</body>
</html>
Задание: Прочитать. Проверить правильность работы программ.