Несколько условий, else if

Лабораторная работа №1. Взаимодействие с пользователем: alert, prompt, confirm

В этой лабораторной работе мы рассмотрим базовые операции с интерфейсом: alert, prompt и confirm, которые позволяют работать с данными, полученными от пользователя.

Размещение JavaScript на HTML-странице

Код скрипта JavaScript размещается непосредственно на HTML-странице. Чтобы увидеть, как делается, давайте рассмотрим следующий простой пример:

<html>
<body>
<br>
Это обычный HTML документ.
<br>
<script language="JavaScript">
alert("А это JavaScript!")
</script>
<br>
Вновь документ HTML.
</body>
</html>

Всплывающие окна

Alert

Синтаксис: alert(сообщение)

alert выводит на экран окно с сообщением и приостанавливает выполнение скрипта, пока пользователь не нажмет «ОК».

1	alert("Привет");

Окно сообщения, которое выводится, является модальным окном. Слово «модальное» означает, что посетитель не может взаимодействовать со страницей, нажимать другие кнопки и т.п., пока не разберется с окном. В данном случае - пока не нажмет на «OK».

Prompt

Функция prompt принимает два аргумента: result = prompt(title, default);

Она выводит модальное окно с заголовком title, полем для ввода текста, заполненным строкой по умолчанию default и кнопками OK/CANCEL.

Пользователь должен либо что-то ввести и нажать OK, либо отменить ввод кликом на CANCEL или нажатием ESC на клавиатуре.

Вызов prompt возвращает то, что ввел посетитель - строку или специальное значение null, если ввод отменен.

Как и в случае с alert, окно prompt модальное.

1	var years = prompt('Сколько вам лет?', 100);
2	alert('Вам ' + years + ' лет!')

Всегда указывайте default

Вообще, второй default может отсутствовать. Однако при этом Internet Explorer (IE) вставит в диалог значение по умолчанию "undefined".

Запустите этот код в IE, чтобы понять о чем речь:

1	var test = prompt("Тест");

Поэтому рекомендуется всегда указывать второй аргумент:

var test = prompt("Тест", ''); // <-- так лучше

Confirm

Синтаксис: result = confirm(question);

confirm выводит окно с вопросом question с двумя кнопками: OK и CANCEL.

Результатом будет true при нажатии OK и false - при CANCEL(Esc).

Например:

1	var isAdmin = confirm("Вы - администратор?");
2	alert(isAdmin);

Особенности встроенных функций

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

С одной стороны — это недостаток, т.к. нельзя вывести окно в своем дизайне.

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

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

Иногда, в зависимости от условия, нужно выполнить различные действия. Для этого используется оператор if.
Например:

1	var year = prompt('В каком году появился интернет?', '');
2	if (year != 1990) alert('А вот и неправильно!');

Оператор if

Оператор if («если») получает условие, в примере выше это year != 1990. Он вычисляет его, и если результат — true (истино), то выполняет команду.

Если нужно выполнить более одной команды — они оформляются блоком кода в фигурных скобках:

1	if (year != 1990) {
2	alert('А вот..');
3	alert('..и неправильно!');
	}

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

Неверное условие, else

Необязательный блок else («иначе») выполняется, если условие неверно:

1	var year = prompt('Введите год появления сети интернет', '');
2	if (year == 1990) {
3	alert('Да вы знаток!');
4	} else {
5	alert('А вот и неправильно!'); // любое значение, кроме 1990
6	}

Несколько условий, else if

Бывает нужно проверить несколько вариантов условия. Для этого используется блок else if .... Например:

1	var year = prompt('В каком году появился интернет', '');
2	if (year < 1990) {
3	alert('Это слишком рано..');
4	} elseif (year > 1990) {
5	alert('Это поздновато..');
6	} else {
7	alert('Да, точно в этом году!');
8	}

В примере выше JavaScript сначала проверит первое условие, если оно ложно — перейдет ко второму — и так далее, до последнего else.

Самостоятельная работа:

1. Создайте страницу, которая спрашивает имя и выводит его.

Напишите код, который будет спрашивать: «Как расшифровать WWW?».

Если посетитель вводит «World Wibe Web», то выводить «Верно!», если что-то другое — выводить «Не знаете? «World Wibe Web»!».

3. Напишите код, который получает число от 1 до 12 в окно prompt, а затем выводит alert с соответствующим названием месяца.

4. Напишите код, который будет спрашивать логин (prompt).

Если посетитель вводит «Админ», то спрашивать пароль, если нажал отмена (escape) — выводить «Вход отменён», если вводит что-то другое — «Я вас не знаю».

Пароль проверять так. Если введён пароль «СуперАдмин», то выводить «Добро пожаловать!», иначе — «Пароль неверен», при отмене — «Вход отменён».

Блок-схема:

СуперАдмин

Для решения используйте вложенные блоки if. Обращайте внимание на стиль и читаемость кода.

Не нашли, что искали? Воспользуйтесь поиском по сайту: