Главная | Обратная связь | Поможем написать вашу работу!

Основы создания сценариев на языке javascript

1. Понятие сценария

JavaScript – язык сценариев, который может применяться в Web-страницах наряду с языком HTML, для создания динамических страниц (страницы которые могут меняться после загрузки).

Программа на языке JavaScript представляет собой последовательность операторов, разделенные точкой с запятой. Операторы могут размещаться как на одной строке, так и на отдельных строках.

Сценарий JavaScript может быть добавлен в Web-страницу между тегами <script> и </script>. Теги <script> могут располагаться в любом месте между тегами <head> и <body>. В файле одной Web-страницы может располагаться несколько сценариев JavaScript. Одним из атрибутов тега <script> является language, который определяет используемый язык сценариев. Для языка JavaScript значение атрибута language равно «JavaScript». Записывается это так

***

<html>

<head>

</head>

<body>

name=window.prompt(“Введите свое имя”);

document.write («Добро пожаловать,» + name + «на мою Web-страницу»);

</script>

</body>

</html>

2. Переменные и константы

Константы в языке JavaScript называются литералами. Литералы как и константы не могут менять своего значения на всем протяжении выполнения программы. Литералы могут быть заданы в десятичном, шестнадцатеричном или восьмеричном виде. Литералы могут быть целого, вещественного, логического, строкового типа. Литералы целого типа в десятичном представлении записываются как последовательность десятичных цифр со знаком или без него: 15, 123, -156. Восьмеричные числа включает только числа 0-7 и записывается, начиная с нуля, например 03, 0543, 011. Шестнадцатеричные числа включают цифры 0-9 и буквы a, b, c, d, e, f и записываются с символов 0х перед числом, например 0х25б 0ха1б 0ха11. Вещественные литералы записываются с точкой. Логические литералы принимают только два значения «true» (истинно) или «false» (ложно). Строковые литералы представляют собой последовательность символов, заключенные в одинарные или двойные кавычки.

В отличии от литералов, переменные могут менять значения во время выполнения программы. Но как и литералы, переменные могут быть целого, вещественного, логического и строкового типа. Логические переменные могут называться булевыми (принимают значения 0 или 1). Переменные должны иметь имя. Имена переменных включают в себя латинские буквы и знак подчеркивания. Для определения переменной в программе используется служебное слово var. Тип переменной определяется автоматически в зависимости от типа хранимых данных.

***

var a=25 - переменная целого типа

var x=2.75 – переменная вещественного типа

var y=true – переменная логического типа

var z=”Выполнение завершено”

В языке JavaScript еще определены такие типы как функция и объект. Для определения функций используется служебное слово function. Для объектов используется тип object.

Переменные могут быть локальными или глобальными. Переменные, определенные в частях <head> и <body> называются глобальными и доступны любому сценарию. Локальные переменные определяются в теле функций и доступны только функции, в которой они определены.

3. Выражения

Выражения в JavaScript строятся из литералов, переменных, знаков операций и скобок. Используемые в выражении переменные должны быть предварительно инициализированные. Операции в языке JavaScript

Название	Обозначение
Инкремент	++
Дектремент	--
Отрицание	!
Унарный минус	-
Умножение	*
Деление, остаток от деления	/, %
Сложение	+
Вычитание	-
Сравнение	<,>,<=, >=
Равенство	= =
Неравенство	!=
Логическое И	&&
Логическое ИЛИ	\|\|
Составные операции	+=, -=, *=, /=, %=,!=
Присваивания	=

***

<html>

<head>

<title> Пример №1</title>

</head>

<body>

var a=8;

var h=10;

var s;

s=(a*h)/2;

document.write (“Площадь треугольника равна”, s);

</script>

</body>

</html>

4. Массивы

Несколько переменных могут быть сгруппированы в виде нумерованного списка, называемого массивом. Ко всем элементам массива можно обращаться по одному и тому же имени, используя различные значения индекса. Порядковый номер или индекс элемента массива указывается после имени массива в квадратных скобках ([]).

Массив можно создавать путем присваивания переменной значения new Array(), при этом количество элементов массива указывается в скобках. После создания массива можно обращаться к его отдельным элементам с помощью имени массива, за которым следует порядковый номер элемента в квадратных скобках. Значения индексов массива всегда начинаются с 0.

Например, оператор array1=new Array(10) создает массив, который может содержать десять значений. В этом случае первый элемент массива обозначается как array1[0], а последний – как array1[9].

Элементы массива не обязательно должны принадлежать одному и тому же типу переменной. Они могут включать несколько различных типов переменных. Например, первый элемент массива может быть целым числом, второй – строковой, третий – числом с плавающей точкой. Каждый элемент массива не зависит от других элементов. Однако попытка перемножить элементы массива разных типов приведет к ошибке.

JavaScript не поддерживает двумерные массивы. Создать двумерный массив можно, создав «массив массива». Этот способ заключается в создании одномерного массива и создания массива из существующего массива с его использованием в качестве элемента. Иногда при обращении к «массиву массива» может возникнуть путаница, но если это действительно необходимо, результат, как правило, стоит затраченных усилий.

<html>

<head> <title> Пример № 2</title>

< /head>

<body>

array=new Array(7);

array[0]=”Понедельник”;

array[1]= “Вторник”;

array[2]=”Среда”;

array[3]= “Четверг”;

array[4]=”Пятница”;

array[5]=”Суббота”;

array[6]=”Воскресенье”;

document.write (array[0], array[1], array[2], array[3],array1[4], array[5], array[6]);

</script>

< /body >

</html >

5. Условные операторы и операторы цикла

К условным операторам относятся оператор if – else и оператор использующий? и:.

Оператор if –else

Формат оператора if (условие) {операторы}

Else {операторы}

Если за оператором if следует один оператор, то фигурные скобки можно не использовать. Если выражение в скобках при операторе if истинно, то выполняются операторы (оператор), следующий за if. В противном случае выполнение передается оператору else. В программе могут использоваться несколько операторов if – else.

Условный оператор?:

Формат условного оператора (условие)?(выражение 1):(выражение 2)

Если условие истинно, то вычисляется выражение 1, если ложно – то выражение 2.

К операторам цикла относятся операторы: for, while.

Оператор for.

Формат оператора for (начальное условие; конечное условие; шаг приращения цикла) {операторы}

Оператор цикла выполняется до тех пор, пока выполняется конечное условие.

Оператор while.

Формат оператора while (условие) {операторы, шаг приращения цикла}

Существует много способов организации цикла в программе. В одних случаях целесообразно использовать оператор while, в других более подходит оператор for. Оператор for требует полной информации о переменных, которые используются в цикле. Оператор while может использовать переменные, объявленные в любом месте программы.

Для работы с операторами цикла используются операторы break и continue. Для выхода из цикла можно использовать оператор break. В основном используется для принудительного выхода из цикла. Оператор break обеспечивает выход из цикла, но не позволяет вернуться в него. Оператор continue останавливает выполнение цикла и возвращает в его начало так, будто все операторы уже выполнились.

6. Функции

Функции – логически завершенные фрагменты программы для выполнения определенных действий. Функцию можно вызвать и получить к ней доступ в любой момент. Функции можно передать параметры, а функция возвращает значение. Формат объявления функции function имя функции () { операторы}. Имена функции подчиняются тем же правилам, что и имена переменных. Переменные объявленные внутри функции с помощью ключевого слова var, являются локальными по отношению к функции, в которой они введены. Переменные, объявленные внутри функции без ключевого слова var, называются глобальными. Также глобальными являются переменные, объявленные вне функции. Функцию после объявления можно вызвать в любом месте программы. Если функцию необходимо выполнять при различных значениях переменных, эти значения можно передавать функции в качестве параметров. Параметры передаются функции в круглых скобках после имени функции. Функции можно передавать значения нескольких переменных, разделив их запятыми. Количество значений при вызове функции должно соответствовать количеству переменных при объявлении функции.

***

function s (a,b,c) – объявление функции s

function s (16,20,30) – вызов функции s

Функции можно указать на необходимость возвратить значение с помощью ключевого слова return. Это позволяет функции определить результирующее значение и переслать его в основную программу. Функция может возвращать данные строкового и числового типа.

***

<html>

<head>

<title> Пример №3</title>

function s(a,h) {

s=(a*h)/2;

return s}

</script>

</head>

<body>

s(10,18);

document.write (“Площадь треугольника равна”, s);

</script>

</body>

<html>

Лекция 5.

Использование объектов

1. Понятие объекта, метода и свойства

Объект – настолько общее понятие, что трудно дать однозначное определение. В общем можно сказать, что в информатике объект – некая абстрактная сущность предметной области или совокупность свойств, методов и событий.

Например, рассмотрим университет как систему. Система состоит из множества объектов, целей и связей между ними. Объектами системой университет являются студент, преподаватель, дисциплины, и т.д. В такой модели студент имеет состояние (свойства), состоящее из атрибутов: имя, номер группы неизменяемое), изучаемые дисциплины (изменяемое). Преподаватель характеризуется именем, ученой степенью (неизменяемое), читаемые дисциплины (изменяемое). Кроме состояния и свойств объектам присущи определенный набор методов, способных изменять состояние объекта. Для студента – это учить и не учить, сдавать не сдавать. Для преподавателя – читать лекцию и не читать, принимать экзамены и зачеты и не принимать. Объекты студенты и преподаватели взаимодействуют между собой посредством сообщений. В результате приема экзамена преподаватель может изменить состояние студента.

В JavaScript можно создавать собственные объекты или использовать предопределенные объекты, такие как string, frame, date, textarea.

Объекты могут обладать свойствами и методами. Свойства объектов несут всю информацию об объекте. К свойствам можно обращаться через точку между именем объекта и свойством. (document.title). Методы – функции, реализующие задачи, характерные для объекта. К методам можно обращаться также как к свойствам через точку. (document.write()).

Разница между свойством и методом заключается в том, что свойство не имеет круглых скобок. Для методов объектов наличие круглых скобок обязательно. В скобках могут быть перечислены значения параметров.

Полный набор объектов JavaScript, относящихся к элементам Web – страниц называют объектной моделью документа. Все объекты, отображающие элементы Web – страницы подчиняются определенной иерархии. Наивысшим родительским объектом является объект window. На следующем уровне находятся объекты document, frame, location, history. Объекты, содержащиеся в другом объекте называются подобъектами. В свою очередь эти объекты включают элементы, образующие Web – страницу, такие как ссылки, формы, изображения и т.д. Элементы также могут являться объектами, например Form. Объекту form подчиняются элементы text, textarea, button м т.д. При обращении к элементам можно ссылаться на объекты, в которых они находятся. Например, ссылка на переключатель в форме выглядит следующим образом: window.document.form.radio или если форма включает текстовое поле, то обращение к значению текстового поля может выглядеть следующим образом: window.document.form.text.value.

Объекты тоже могут рассматриваться как элементы электронного документа. Если в документе несколько объектов, то обращение к отдельным объектам выглядит следующим образом, например к форме: window.document.form[0], window.document.form[1] и т.д. Все ссылки нумеруются, начиная с нуля. Так как объект window является наивысшим, то указывать его не обязательно. По умолчанию уже подразумевается, что все объекты и элементы принадлежат объекту window. Если указываются объекты, используемые вне текущего документа, то указывать объект window обязательно.

При обращении к подобъектам всегда должно указываться имя свойства или имя метода. Если обращение не завершается именем свойства или метода значит, объект не определен.

2. Создание новых объектов

В JavaScript объекты условно можно разделить на предопределенные и пользовательские. Предопределенные объекты – объекты, которые создаются с помощью встроенных функций JavaScript. Одни из таких объектов создаются неявно, например объект типа string (строковая переменная) создается при объявлении строки в программе и получить доступ к свойствам и методам объекта строковой переменной можно следующим образом: string.length, другие создаются с помощью ключевого слова new и функции конструктора.

Конструктор – метод, имя которого совпадает с именем объекта. Конструктор используется при создании объекта.

Для создания пользовательского объекта применяется ключевое слово new с конструктором Object().

Иногда объекты можно создавать с помощью функции, которая определяет объект. Одни переменные, входящие в функцию играют роль свойств, другие методов.

***

<html>

<head>

<title> Пример № 3</title.

</head>

function newfun (obj) {

var a=obj.a1.value;

var h=obj.h1.value;

var s=(a*h)/2;

obj.s1.value= s; }

</script>

</head>

<body.

<p> Вычисление площади треугольника</p>

Основание: <input type=”text” size=10 name=”a1”> <br>

Высота: <input type=”text” size=10 name=”h1”> <br>

Площадь <input type=”text” size=10 name=”s1”> <br>

</form>

</body>

</html>

3. Обращение к объектам

При обращении к объектам иногда может оказаться довольно трудоемко выписывать всю иерархию подобъектов каждый раз, когда требуется использовать конкретный объект. В JavaScript есть специальный оператор, позволяющий обращаться непосредственно к текущему объекту. Для ссылки на текущий объект используется оператор this. Ключевое слово this можно поместить на место родительского объекта, однако этот оператор можно применять только в пределах текущей функции.

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

Например, к переменной функции newfun (x1) в теле этой функции можно обратиться следующим образом: this.name=x1

Оператор this можно использовать для ссылки на текущий элемент web – страницы. Например, если функции в качестве параметра передается значение текстового поля формы, к этому значению можно обратиться внутри обработчика события с помощью конструкции this.value.

***

function newfun (x1) {

document.write (“x1”); }

………….

</form>

4. Просмотр свойств объектов

При работе с объектами часто необходимо просмотреть свойства объектов. Получить информацию о свойствах можно с помощью оператор цикла for. Этот оператор for содержит ключевое слово in и имя объекта. Например, для просмотра свойств объекта window используется следующая конструкция: for (prop in window). А чтобы вывести свойства на экран можно включить в цикл оператор document.write.

Для отображения значений свойств также можно использовать оператор window[prop].

Все эти операторы применимы только к тем объектам, которые были определены в программе. Если объект не существует, то никакие свойства не отображаются.

5. Использование объектов Array, Image, Link, Anchor, History.

Объект Array создается в процессе создания массива (предопределенный объект).

Объект Array обладает свойством length, определяющее длину массива. Если например, создан массива array1=new Array(30), то значение свойства array1.length будет равно 30.

Объект Array включает также несколько методов, которые можно использовать при работе с элементами массива. Метод join () соединяет все элементы массива в одну строку, при этом разделителем элементов в строке служит значение, передаваемое в метод в качестве параметра (array.join («!»)).

Метод sort () используется для упорядочения элементов массива. Этот метод сортирует элементы массива в алфавитном порядке. Когда этот метод применяется к численному массиву, числа тоже сортируются в алфавитном порядке. Например, массив со значениями 15,5,2,10 после сортировки будет выглядеть следующим образом: 10, 15, 2, 5. Для сортировки чисел в обычном порядке создается другая функция, реализующая метод сортировки не в алфавитном, а в цифровом порядке, и имя этой функции передается методу sort ().

***

function Sort (var1, var2) {

return var1-var2; }

mas= new Array ();

str=mas.sort(Sort);

Метод reverse () изменяет порядок следования элементов массива на обратный.

Объект image создается, если на web-странице расположено изображение. Если на странице расположено несколько изображений, тогда обращаться к каждому объекту image следует таким образом: document.image[0], document.image[1],… Объект image обладает свойствами: width (ширина), height (высота), border (толщина рамки), и.д. Эти свойства позволяют динамически изменять атрибуты изображения с помощью сценариев JavaScript.

Аналогично объекту image объекты link, anchor организуются в виде массива. Например, если на странице имеются два элемента привязки и три гиперссылки, ссылка на первый элемент привязки будет следующая document.anchor[0], а ссылка на первую гиперссылку – document.link[0].

Объект link включает свойство href, которое позволяет динамически изменять гиперссылки. Объект anchor – свойство name, позволяющее изменять имя элемента привязки.

Для организации перемещения между просмотренными страницами используется объект history. Объект history включает свойство lehgth, которое позволяет просмотреть длину списка, просмотренных страниц. Также объект history включает несколько методов. Метод back() может привести к появлению в окне броузера предыдущей загруженной страницы. Метод forward () отображает следующую страницу. Метод go () используется для перелистывания страниц. Document.history.go(-2) – отображает страницу на две страницы назад.

Лекция 6.

Обработка событий

1. Использование обработчиков событий

Обработчики событий JavaScript представляют собой небольшие подпрограммы, связывающие действия пользователей со сценариями, которые необходимо выполнить в ответ на эти действия. К таким действиям относятся щелчки мышью, нажатие клавиш клавиатуры, выбор или изменением элементов формы и даже загрузка или выгрузка Web-страниц.

События, генерируемые мышью, происходят в тот момент, когда пользователь щелкает мышью или перемещает ее. Если пользователь щелкает кнопкой мыши один раз, срабатывает обработчик события onClick. После щелчка мышью запускается присоединенная процедура для формирования ответной реакции на щелчок.

Когда пользователь делает двойной щелчок, срабатывает обработчик события ondbClick. Событие onmoysedown происходит когда кнопка мыши наживается, а событие onmouseup - когда кнопка мыши отпускается. Событие onmouseover срабатывает когда указатель мыши расположен на некотором элементе. Событие onmouseout – когда указатель мыши перемещается с элемента.

Событие onkeypress можно использовать для определения момента, когда клавиша на клавиатуре нажимается.

Событие onfocus используется когда необходимо чтобы элемент получил фокус. Событие onblur снимает фокус.

При выборе объекта срабатывает событие onselect.

При работе с элементами формы может использоваться событие onchange. Оно происходит при изменении элементов формы. Обработчик событий onload используется для установления момента полной загрузки Web – страницы. Событие onunload наступает при полной выгрузке web – страницы.

2. Обработка щелчка мышью

Обработчик событий щелчка мышью onClick обычно присоединяется к кнопкам формы, созданным с помощью тегов <input> или <button>.

Аналогично действию обработчика событий одинарного щелчка мышью действия двойного щелчка мышью ondbclick.

3. Создание кнопок

HTML позволяет создавать кнопки двумя способами. Первый способ состоит в использовании тега <input> и установлении значения атрибутов type равным button, reset (сброс), submit (подача запроса) и value (определяет текст кнопки) и name (имя кнопки). Второй способ заключается в использовании тега <button>. Применение тега <button> и тега <input> дают один и тот же результат.

Совместно с кнопками применяются обработчики событий onClick и ondbClick.

***

<html>

<head>

<title> Пример № 4</title.

</head>

function newfun (obj) {

var a=obj.a1.value;

var h=obj.h1.value;

var s=(a*h)/2;

obj.s1.value= s; }

</script>

</head>

<body BACKGROUND="BACKGRND.GIF>.

<p> Вычисление площади треугольника</p>

Основание: <input type=”text” size=10 name=”a1”> <br>

Высота: <input type=”text” size=10 name=”h1”> <br>

Площадь <input type=”text” size=10 name=”s1”> <br>

</form>

function closeIt() {

close();

}

</script>

</form>

</body>

</html>

Лекция 7

Работа с формами

Создавая динамические Web страницы удобно организовывать взаимодействие с пользователем с помощью форм. Формы предоставляют пользователю возможность вводить простые типы данных с помощью текстовых полей, кнопок переключателя, кнопок флажков, списков типа меню.

Формы создаются с помощью тегов <form></form>. Формы располагают в теле документа, т.е. в тегах <body></body>. Форма является объектом и соответственно к форме можно обращаться по имени, которое присваивается атрибуту name. Например, <form name=form1>

Если форм несколько, к ним можно обращаться по форме document.forms[“имя формы”]

Такт как объект form имеет свойство – массив elements, в котором содержатся ссылки на элементы формы, то получить доступ к элементам формы можно с помощью следующей конструкции form1.elements[N].value. В качестве фактического параметра, передаваемого из формы функции, будет элементы формы в порядке их перечисления в теге <form>

1. Использование текстовых полей и областей.

С помощью JavaScript можно динамически изменять содержимое элементов формы, например, текстового поля.

Текстовые поля определяются с помощью тега <input> и установки атрибута type равным text. Например, <input type=text>. Также текстовые поля имеют атрибуты name, value, size. Для обращения к текстовому полю необходимо указать имя формы и имя текстового поля. Например, form1.text1.value – таким образом можно получить значение текстового поля с именем text1 в форме с именем form1. Текстовое поле также может быть объектом, который обладает свойствами и методами. К свойствам объекта – текстового поля относятся свойств такие как type, value, name, size. К методам текстового поля относятся методы focus(), blue(), select ().

Текстовые области подобны текстовым полям, дополненные возможностью многострочного ввода. Текстовая область также является объектом. Объекты такого типа создаются с помощью тега <input type=textarea>. Также как и объект текстовое поле, текстовая область имеет свойства и методы. К свойствам объекта относятся такие свойства как name, type, value, rows, cols. Свойство rows, cols позволяет задать размер текстовой области. Свойство cols определяет ширину области в символах, свойство rows задает количество строк текста, которое можно ввести в текстовую область. Объект textarea обладает методами focus (), blur (), select ().

2. Использование флажков

Флажки – элементы управления, используемые в том случае, если нужно выбрать несколько вариантов. На экране флажок представлен квадратом. Выбор вариантов задается флажком, который можно либо установить, либо сбросить. Флажок определяется в теге <input> значением checkbox в атрибуте type. Обязательным параметром является параметр value, значение которого будет передано на обработку в случае нажатия кнопки выбора. Кроме этих параметров могут использоваться параметры name, checked. Параметр checked может принимать значение равное true, если флажок выставлен, или false - если флажок снят. Флажки также являются объектами, поэтому они обладают методами click (), focus().

***

<html>

<head>

<title>Пример 2</title>

</head>

<body>

function check() {

var a=form1.C1.checked;

var b=form1.C2.checked;

var c=form1.C3.checked;

var d=form1.C4.checked;

if (a==true)

form1.res1.value="Выбран флажок 1";

if (b==true)

form1.res1.value="Выбран флажок 2";

if (c==true)

form1.res1.value="Выбран флажок 3";

if (d==true)

form1.res1.value="Выбран флажок 4";

}

</script>

<p><input type="checkbox" name="C1" value="Флажок 1" >флажок 1 </p>

<p><input type="checkbox" name="C2" value="Флажок 2" >флажок 2</p>

<p><input type="checkbox" name="C3" value="Флажок 3" >флажок 3</p>

<p><input type="checkbox" name="C4" value="Флажок 4" >флажок 4</p>

</form>

</body>

</html>

3. Использование переключателей.

Если нужно из нескольких вариантов выбрать только один используются переключатели (кнопки). Элемент переключатель отображается в виде круглой кнопки и существует только в составе группы переключателей. Все элементы этой группы должны иметь одинаковое значение параметра name и разное значение параметра value. Каждый отдельный переключатель нумеруется в соответствии с порядком его появления в форме. Первый переключатель имеет нулевой номер. Создаются переключатели с помощью тега <input> и значением radio присвоенного параметру type. Аналогично флажкам переключатели как объекты имеют свойства и методы. К свойствам переключателя относятся параметры name, value, length, checked. К методам переключателя относятся Click (), Focus ().

***

Сценарий, в котором в зависимости от длины стороны или радиуса и формы вычисляется площадь выбранной фигуры (квадрат, круг, треугольник). Площадь рассматриваемых фигур вычисляется по формуле , где k – коэффициент, зависящий от формы выбранной фигуры, a – значение, задаваемое пользователем.

<HTML>

<HEAD>

<TITLE> Пример 3 </TITLE>

function test (k) {

var a=form1.a1.value;

if (a!=" ")

form1.res.value=k*Math.pow(a,2)

else aletr ("Введите значение") }

</script>

</HEAD>

<BODY>

Введите значение

Выберите фигуру<hr>

<input type="radio" name="k" value=1 onClick= "test(form1.elements[1].value)"> квадрат <br>

<input type="radio" name="k" value=0.42 onClick= "test(form1.elements[3].value)"> треугольник <br>

Площадь: <input type="text" name="res" size=10>

</FORM>

</BODY>

</HTML>

4. Работа со списками типа меню

Для создания списков типа меню используется объекты select и option. Каждый элемент списка создается с помощью тега <option> в теге <select>.

Объект select используется для выбора элементов списка. Он включает свойства name, length, size, selectedIndex. Свойство length возвращает количество вариантов в списке выбора, а свойство selectedIndex хранить номер выбранного элемента списка. Также объект обладает методами blur (), focus ().

Объект option представляет собой подобъект объекта select. Этот объект – массив, к каждому элементу которого можно обратиться с помощью значения его индекса. Объект option обладает свойствами, относящимися непосредственно к отдельным элементам списка. Свойство defaultSelected возвращает номер элемента списка, который считается выбранным по умолчанию. Свойство selectedIndex указывает на текущий выбранный элемент списка, свойство selected – указывает, выбран ли текущий элемент списка. Свойство text возвращает в качестве значения текст, размещенный между тегами <option>. Кроме того объекту option обладает такими свойствами как lehgth, name, value. Свойства можно применять к отдельным элементам списка с помощью значений их индексов. Методов у объекта option нет.

***

<html>

<head>

<title>Пример 4</title>

</head>

function list () {

var r;

if ((form1.forma.options[0]).selected)

r=(form1.forma.options[0]).text;

else

if ((form1.forma.options[1]).selected)

r=(form1.forma.options[1]).text;

else

if ((form1.forma.options[2]).selected)

r=(form1.forma.options[2]).text;

form1.res.value=r; }

</script>

<body>

Выберите фигуру <br>

<option value=0> Квадрат

<option value=1> Круг

<option value=2> Треугольник

</select>

Выбранная форма:<input type="text" name="res" size=10>

</form>

</body>

</html>

Для выбора элементов списка можно пользоваться другой конструкцией. Для того чтобы осуществить доступ к элементам списка можно воспользоваться такой конструкцией: form1.elements[N].[N1].selected, где N – номер элемента управления (в данном примере их три: список, кнопки Выбрать и Отмена), N1 – номер элемента списка. Свойство selected указывает, выбран ли элемент списка (т.е. возвращает значение true – если выбран, и значение false – если не выбран). Свойство text выводит в текстовое поле значение, заданное после тега option.

<html>

<head>

<title>Пример 5</title>

</head>

function test () {

var r;

if (((form1.elements[0])[0]).selected)

r=((form1.elements[0])[0]).text;

else

if (((form1.elements[0])[1]).selected)

r=((form1.elements[0])[1]).text;

else

if (((form1.elements[0])[2]).selected)

r=((form1.elements[0])[2]).text;

form1.res.value=r; }

</script>

<body>

Выберите фигуру <br>

<option value=0> Квадрат

<option value=1> Круг

<option value=2> Треугольник </select>

Выбранная форма:<input type="text" name="res" size=10>

</form>

</body>

</html>

Лекция 8.

⇐ Предыдущая 1 2 345 Следующая ⇒

Воспользуйтесь поиском по сайту: