Что можно задать вторым параметром функции prompt
Перейти к содержимому

Что можно задать вторым параметром функции prompt

  • автор:

Взаимодействие: alert, prompt, confirm

Так как мы будем использовать браузер как демо-среду, нам нужно познакомиться с несколькими функциями его интерфейса, а именно: alert , prompt и confirm .

alert

С этой функцией мы уже знакомы. Она показывает сообщение и ждёт, пока пользователь нажмёт кнопку «ОК».

alert("Hello");

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

prompt

Функция prompt принимает два аргумента:

result = prompt(title, [default]);

Этот код отобразит модальное окно с текстом, полем для ввода текста и кнопками OK/Отмена.

title Текст для отображения в окне. default Необязательный второй параметр, который устанавливает начальное значение в поле для текста в окне.

Квадратные скобки в синтаксисе [. ]

Квадратные скобки вокруг default в описанном выше синтаксисе означают, что параметр факультативный, необязательный.

Пользователь может напечатать что-либо в поле ввода и нажать OK. Введённый текст будет присвоен переменной result . Пользователь также может отменить ввод нажатием на кнопку «Отмена» или нажав на клавишу Esc . В этом случае значением result станет null .

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

let age = prompt('Сколько тебе лет?', 100); alert(`Тебе $ лет!`); // Тебе 100 лет!

Для IE: всегда устанавливайте значение по умолчанию

Второй параметр является необязательным, но если не указать его, то Internet Explorer вставит строку «undefined» в поле для ввода.

Запустите код в Internet Explorer и посмотрите на результат:

let test = prompt("Test");

Чтобы prompt хорошо выглядел в IE, рекомендуется всегда указывать второй параметр:

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

confirm

result = confirm(question);

Функция confirm отображает модальное окно с текстом вопроса question и двумя кнопками: OK и Отмена.

Результат – true , если нажата кнопка OK. В других случаях – false .

let isBoss = confirm("Ты здесь главный?"); alert( isBoss ); // true, если нажата OK

Итого

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

alert показывает сообщение. prompt показывает сообщение и запрашивает ввод текста от пользователя. Возвращает напечатанный в поле ввода текст или null , если была нажата кнопка «Отмена» или Esc с клавиатуры. confirm показывает сообщение и ждёт, пока пользователь нажмёт OK или Отмена. Возвращает true , если нажата OK, и false , если нажата кнопка «Отмена» или Esc с клавиатуры.

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

На все указанные методы распространяются два ограничения:

  1. Расположение окон определяется браузером. Обычно окна находятся в центре.
  2. Визуальное отображение окон зависит от браузера, и мы не можем изменить их вид.

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

Что можно задать вторым параметром функции prompt

Создание игр на Unreal Engine 5

Создание игр на Unreal Engine 5

Данный курс научит Вас созданию игр на Unreal Engine 5. Курс состоит из 12 модулей, в которых Вы с нуля освоите этот движок и сможете создавать самые разные игры.

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

Помимо самого курса Вас ждёт ещё 8 бесплатных ценных Бонусов: «Chaos Destruction», «Разработка 2D-игры», «Динамическая смена дня и ночи», «Создание динамической погоды», «Создание искусственного интеллекта для NPC», «Создание игры под мобильные устройства», «Создание прототипа RPG с открытым миром» и и весь курс «Создание игр на Unreal Engine 4» (актуальный и в 5-й версии), включающий в себя ещё десятки часов видеоуроков.

Уроки и статьи

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube

Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка

Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт

Мой аккаунт Моя группа

Какая тема Вас интересует больше?

Бесплатный курс

Мастер-класс по созданию сайта на WordPress 6

Мастер-класс по созданию сайта на WordPress 6

Этот видеоурок длится всего 21 минуту, но уже в конце создан полностью рабочий сайт на WordPress (с применением ChatGPT). И весь процесс Вы увидите своими глазами, а повторить - не составит труда!

Чтобы получить Видеокурс,
заполните форму

Бесплатный онлайн-семинар

Как создать профессиональный Интернет-магазин

Как создать профессиональный Интернет-магазин

После семинара:

- Вы будете знать, как создать Интернет-магазин.

- Вы получите бесплатный подарок с подробным описанием каждого шага.

- Вы сможете уже приступить к созданию Интернет-магазина.

Функция prompt

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

В окошке что появится будет находится текстовое поле, и две кнопки - ОК, CANCEL. При нажатии на ОК - возвращается введенная пользователем строка, а при нажатии на CANCEL - null .

Синтаксис

prompt(сообщение, [текст по умолчанию]);

Пример

По нажатию на кнопку спросим имя пользователя, а затем выведем это имя с помощью функции alert :

let button = document.querySelector('#button'); button.addEventListener('click', function(event) < let res = prompt('What is Your name?'); alert(res); >);

Пример

Сделаем так, что имя пользователя уже будет вставлено по умолчанию, однако пользователь сможет его поменять:

let button = document.querySelector('#button'); button.addEventListener('click', function(event) < let res = prompt('What is Your name?', 'John'); alert(res); >);

Смотрите также

  • функцию alert ,
    которая выводит диалоговое окно с сообщением
  • функцию confirm ,
    которая выводит диалоговое окно для подтверждения

prompt

Выводит сообщение в окне с текстовым полем и двумя кнопками: "ОК" и "ОТМЕНА".

Возвращает введенное значение или null, если посетитель нажал на кнопку "ОТМЕНА".

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

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

Автор: Гость (не зарегистрирован), дата: 28 августа, 2009 - 08:47

а как можно задать координаты окна prompt? В Firefox оно в центре окна,а в IE - в левом верхнем углу. Нельзя его оттуда перетащить?

Автор: ГостьНейм (не зарегистрирован), дата: 19 августа, 2013 - 12:53
Автор: Вит (не зарегистрирован), дата: 1 ноября, 2009 - 23:39

Спасибо огромное;)
нужна была обработка веденного ключа на
правильное, неправильное значения и на отмену ввода
до этого момента не знал как разделить последние два события..

Автор: Romych, дата: 20 февраля, 2010 - 16:26

объясните пожалуйста, как исправить размер модального окна в IE ?
с методом prompt
вот это окно в Опере

Автор: ivsid50@yandex.ru (не зарегистрирован), дата: 7 декабря, 2012 - 08:01

Уважаемый товарищ, у меня тот же вопрос. Если Вы уже знаете ответ, то прошу сообщить и мне. Спасибо.

Автор: maxmaster, дата: 2 января, 2013 - 15:42

Размеры и положение модальных окон регулируются браузерами самостоятельно. На них никак нельзя повлиять. Поэтому там, где требуется красивая форма ввода, не используют prompt, а получают значение из красиво нарисованной на HTML формы

Автор: Данил Агеев (daxiz555) (не зарегистрирован), дата: 7 июня, 2010 - 15:54

В том примере не доработка.
Скрипт расщитан на вывод alert(ом) данные введенные тогда.
но если пользователь оставит поле пустым он выведет "Вам null лет", нужно исправить:

var years=prompt('Сколько вам лет?','100'); if (years == '') else
Автор: SWS (не зарегистрирован), дата: 3 августа, 2010 - 10:08

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

var years=prompt('Сколько вам лет?','100'); if (years == '') else
Автор: Loydi (не зарегистрирован), дата: 23 августа, 2010 - 22:18

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

Лучше:

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

А вобще null и пустая строка - разные вещи, а значит здесь как проверку нужно использовать:

years = years == null ? 0 : years;

А вообще, лучше всунуть в цикл и проверить что вводится именно число:

do < var years=prompt('Сколько вам лет?','100'); years = parseInt(years, 10); // округляем =>если не число, то NaN > while (isNaN(years)); alert('Вам '+years+' лет!');

Ну и идеальный вариант - объёдинить проверку на null и на NaN

Автор: Loydi (не зарегистрирован), дата: 23 августа, 2010 - 22:55

years = parseInt(years, 10); // округляем => если не число, то NaN
упс, глюкануло: parseInt - выделение числ. части, конечно.

Автор: Гость (не зарегистрирован), дата: 4 октября, 2020 - 19:59

а почему именно число , может с айпона голосовым вводом вводят - и там строка появится.

Автор: Гость (не зарегистрирован), дата: 6 июля, 2011 - 19:48

Как избавиться от самопроизвольного повторного выскакивания промптовского окна после получения результата?

Автор: Гость (не зарегистрирован), дата: 26 января, 2012 - 07:55

Попроще, чтоб два раза не выскакивало, я сразу в окно поместил ответы, вот мой пример:

var imya = prompt ("Напишите свое имя здесь:"," "); var gody = prompt ("Напишите, сколько вам лет здесь:"," "); var nastroenie = prompt ("Напишите, какое у вас настроение здесь:"," "); document.write("Здравствуй, " + imya + "! Тебе"); document.write(" " + gody + " лет(год),"); document.write(" и у тебя " + nastroenie + " настроение!"); document.write(" Всё верно, не так-ли?!");

Автор: Micha (не зарегистрирован), дата: 23 сентября, 2013 - 23:10

Параметр value использовать все же рекомендуется, т.к. в ИЕ по умолчанию в поле написано undefinded, но мы ведь этого не хотим, верно?
поэтому так корректнее:
promt("Введите что нибудь","")

Автор: Гость (не зарегистрирован), дата: 17 октября, 2013 - 06:49

Собрал в работающий пример всё прозвучавшее в комментариях, добавил замену запятой на точку, проверку на допустимость значения и выбор "год-года-лет":

  

Автор: Гость (не зарегистрирован), дата: 17 октября, 2013 - 06:57

// тут ещё нужно условие на 111..114 лет :-D document.writeln( 'Вам ' + years + (years%10==1&&years!=11&&years!=111?' год.':( (years%10>1&&years%10<5)&&(years<11||years>14&&years<111||years>114) ?' года.':' лет.')) + '
' )

Автор: Гость (не зарегистрирован), дата: 27 мая, 2014 - 10:27

Вот вы реально идиоты ))
Отлично позамарачивались! ))

Автор: Гость (не зарегистрирован), дата: 21 декабря, 2014 - 22:18

Возможно ли и каким обазом ,задав значение переменной можно задать ею значение атрибута тега?

(например тега
P.S. сея прога не работает, как ее можно исправить?

Автор: Гость (не зарегистрирован), дата: 21 декабря, 2014 - 22:21

Возможно ли и каким обазом ,задав значение переменной можно задать ею значение атрибута тега?

x1=prompt(". ");
y1=prompt(". ");

(например тега
P.S. сея прога не работает, как ее можно исправить?

Автор: Гость (не зарегистрирован), дата: 21 декабря, 2014 - 22:23
Автор: Гость (не зарегистрирован), дата: 5 января, 2015 - 04:06

А как сделать так,чтобы если ответ в промпте не целевой,опять отрывался начальный промпт,после второго сообщения.?

Автор: Гость (не зарегистрирован), дата: 20 февраля, 2016 - 12:19
Автор: OMD (не зарегистрирован), дата: 29 января, 2015 - 11:51
var years=prompt('Сколько вам лет?', '100'); // return string | null if (years === '' || years === null) < alert('Вы не указали свой возраст!'); >else
Автор: Георгий Тамразян (не зарегистрирован), дата: 20 февраля, 2016 - 12:18

Самый короткий способ:

var years=prompt('Сколько вам лет?', '100'); // return string | null if (!years) < // будет истина только если вернет строку alert('Вы не указали свой возраст!'); >else

Но в 2016 году ни один из представленных способов не работает, если нажать Отмена. Возвращает все равно null. За исключением IE.

Автор: Гость (не зарегистрирован), дата: 3 ноября, 2016 - 01:11

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

Автор: Гость (не зарегистрирован), дата: 7 ноября, 2016 - 17:08

элементарно Ватсон: меняете кому нибудь innerHTML

Автор: Гость (не зарегистрирован), дата: 20 ноября, 2016 - 13:59

Здравствуйте! А как можно сделать так, чтобы в огромном "вопроснике", после неудачного ответа в середине "вопросника", выводила обратно на этот же вопрос, а не в начало "вопросника"?

Автор: Гость (не зарегистрирован), дата: 20 ноября, 2016 - 14:02

я понял, через do. while, а можно небольшой кодик, в пример этому способу?(

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *