Лекция
Привет, сегодня поговорим про взаимодействие с пользователем, обещаю рассказать все что знаю. Для того чтобы лучше понимать что такое взаимодействие с пользователем, alert prompt confirm , настоятельно рекомендую прочитать все из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend).
alert
prompt
confirm
В этом разделе мы рассмотрим базовые UI операции: alert
, prompt
и confirm
, которые позволяют работать с данными, полученными от пользователя.
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 |
3 |
alert( 'Вам ' + years + ' лет!' ) |
default
Вообще, второй default
может отсутствовать. Об этом говорит сайт https://intellect.icu . Однако при этом IE вставит в диалог значение по умолчанию "undefined"
.
Запустите этот код в IE, чтобы понять о чем речь:
1 |
var test = prompt( "Тест" ); |
1 |
var test = prompt( "Тест" , '' ); // <-- так лучше |
confirm
Синтаксис:
result = confirm(question); |
confirm
выводит окно с вопросом question
с двумя кнопками: OK и CANCEL.
Результатом будет true
при нажатии OK и false
- при CANCEL(Esc).
Например:
1 |
var isAdmin = confirm( "Вы - администратор?" ); |
2 |
3 |
alert(isAdmin); |
Место, где выводится модальное окно с вопросом, и внешний вид окна выбирает браузер. Разработчик не может на это влиять.
С одной стороны — это недостаток, т.к. нельзя вывести окно в своем дизайне.
С другой стороны, преимущество этих функций по сравнению с другими, более сложными методами взаимодействия, которые мы изучим в дальнейшем — как раз в том, что они очень просты.
Это самый простой способ вывести сообщение или получить информацию от посетителя. Поэтому их используют в тех случаях, когда простота важна, а всякие «красивости» особой роли не играют.
alert
выводит сообщение.prompt
выводит сообщение и ждет, пока пользователь введет текст, а затем возвращает введенное значение или null
, если ввод отменен (CANCEL/Esc).confirm
выводит сообщение и ждет, пока пользователь нажмет «OK» или «CANCEL» и возвращает true/false
.К сожалению, в одной статье не просто дать все знания про взаимодействие с пользователем. Но я - старался. Если ты проявишь интерес к раскрытию подробностей,я обязательно напишу продолжение! Надеюсь, что теперь ты понял что такое взаимодействие с пользователем, alert prompt confirm и для чего все это нужно, а если не понял, или есть замечания, то не стесняйся, пиши или спрашивай в комментариях, с удовольствием отвечу. Для того чтобы глубже понять настоятельно рекомендую изучить всю информацию из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)
Из статьи мы узнали кратко, но содержательно про взаимодействие с пользователем
Комментарии
Оставить комментарий
Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)
Термины: Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)