Что такое prompt и alert в javascript

Что такое prompt и alert в javascript

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

alert('Наше модальное окно');

Обычно используется для вывода на экран пользователя оповещений о чем-либо (к примеру о неверно заполненных полях формы) или же для отладки кода, чтобы выяснить на каком месте кода начинается некорректное выполнение скрипта.

prompt

Второй по распространенности после операции alert является prompt. Данная команда предоставляет пользователю больше возможностей для взаимодействия с модальным окном, делая доступными для нажатия две кнопки (OK и CANCEL) и поле для ввода информации. Для того, чтобы продолжить работу с сайтом, юзеру необходимо или закрыть данное окно, кликнув на CANCEL (нажатие EST на клавиатуре также сработает) или ввести информацию в поле для ввода и нажать ОК. В случае отмены ввода текста в поле (нажатие CANCEL) в скрипт будет возвращено специальное значение null. Подробнее о котором можно почитать тут. В случае заполнения поля и нажатия ОК, в скрипт вернется информация, которую ввел пользователь. Синтаксис данной команды несколько сложнее, чем предыдущей, поскольку позволяет задать текст обращения к пользователю и содежимое поля для ввода информации, которое будет выводиться по умолчанию: result = prompt ( title , default ) ; , где

• title — сообщение, которое будет выведено пользователю в модальном окне. Аргумент обязательный для заполнения.
• default — то, что выведется в поле для ввода текста по умолчанию. Также обязателен для заполнения, поскольку если его не задать, то это может привести к ошибкам в некоторых браузерах. Если же вы хотите оставить поле ввода информации пустым, то просто задайте prompt следующим образом:

var myTest = prompt("Любое инфо", "'');

Маленький пример использования prompt:

var year = prompt('В каком году вы закончили ВУЗ?', 2008); alert('Вы выпускник ' + year + ' года!');

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

confirm

Также представляет собой модальное окно. Как не сложно догадаться из названия используется обычно для согласования чего-либо с пользователем.

Для того и заточена — для взаимодействия предоставляет пользователю кнопки OK и CANCEL, которые возвращают скрипту булевы значения true и false соответственно.

По синтаксису не отличается от alert.

var legalAge = confirm("Вам исполнилось 18 лет?"); alert(legalAge);

Обратите внимание

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

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

#9 – Всплывающие окна (alert, prompt, confirm)

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

Видеоурок

Для работы с пользователем в JavaScript предусмотрено несколько интерактивных функций:

• функция alert() позволяет выводить информацию во всплывающем окне;
• функция confirm () позволяет спрашивать соглашение во всплывающем окне;
• функция prompt() получает данные от пользователя во всплывающем окне.

Функция alert позволяет вывести какую-либо информацию во всплывающем окне в браузере. К таким окнам нельзя добавить стили и разукрасить их.

alert("Просто вывод информации");

Тест функции alert

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

Функция confirm открывает всплывающее окно с определенным вопросом и двумя кнопками: Ок и Отмена . Полученные данные из окна можно проверить в условном операторе и в зависимости от них выполнить код.

Пример вызова окна:

var result = confirm("Вы согласны с confirm?"); // Если ок, то result будет true // Если отмена, то result будет false

Тест функции confirm

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

Метод prompt получает информацию от пользователя. Полученные данные можно поместить в переменную.

var info = prompt("Сколько вам лет?", 25); // Второй параметр это значение по-умолчанию // Его можно и не добавлять

Тест функции prompt

В примере данные будут помещены в переменную info . После получения данных с ними можно работать как с обычной переменной.

Весь код будет доступен после подписки на проект!

Interaction: alert, prompt, confirm

As we’ll be using the browser as our demo environment, let’s see a couple of functions to interact with the user: alert , prompt and confirm .

alert

This one we’ve seen already. It shows a message and waits for the user to press “OK”.

alert("Hello");

The mini-window with the message is called a modal window. The word “modal” means that the visitor can’t interact with the rest of the page, press other buttons, etc, until they have dealt with the window. In this case – until they press “OK”.

prompt

The function prompt accepts two arguments:

result = prompt(title, [default]);

It shows a modal window with a text message, an input field for the visitor, and the buttons OK/Cancel.

title The text to show the visitor. default An optional second parameter, the initial value for the input field.

The square brackets in syntax [. ]

The square brackets around default in the syntax above denote that the parameter is optional, not required.

The visitor can type something in the prompt input field and press OK. Then we get that text in the result . Or they can cancel the input by pressing Cancel or hitting the Esc key, then we get null as the result .

The call to prompt returns the text from the input field or null if the input was canceled.

let age = prompt('How old are you?', 100); alert(`You are $ years old!`); // You are 100 years old!

In IE: always supply a default

The second parameter is optional, but if we don’t supply it, Internet Explorer will insert the text «undefined» into the prompt.

Run this code in Internet Explorer to see:

let test = prompt("Test");

So, for prompts to look good in IE, we recommend always providing the second argument:

let test = prompt("Test", ''); // 

result = confirm(question);

let isBoss = confirm("Are you the boss?"); alert( isBoss ); // true if OK is pressed

alert("Текст сообщения");

var result=confirm("Текст вопроса"); //условная конструкция для проверки результата if(result) < /* действия */ >else < /* действия */ >

var str=prompt("Запрос на ввод данных", значение_по_умолчанию);

parseInt("строка") - преобразует строку в целое число; parseFloat("строка") - преобразует строку в число с плавающей точкой.

html> body> script type="text/javascript"> var number, summ=0; do < number=parseInt(prompt("Введите число:", 10)); summ+=number; >while(confirm("Продолжим?")) alert("Сумма чисел: "+summ); /script> /body> /html>

input type="submit" name="submit" value="payment" style="margin-left:30px" onclick=" var mcount=prompt('Amount of payment', 10); if (mcount) alert('You enter: '+mcount); else return false; "/>