Підступна війна росії проти України. Орієнтовні втрати ворога
(станом на 15.03.2024)
428420
осіб
347
літаків
325
гелікоптерів
6758
танків
12949
ББМ
10580
артилерія
717
ППО
1017
РСЗВ
13993
машин
26
кораблі і катери
Уроки JavaScript – Діалогові вікна alert, confirm і prompt
Опубліковано

Уроки JavaScript – Діалогові вікна alert, confirm і prompt

Діалогові вікна дозволяють взаємодіяти з користувачем і працювати з даними, які отримані від цього користувача. Ви, безсумнівно, бачили їх, використовували їх і вони вас завжди дратували, коли вони з’являлися на якомусь сайті. Тепер прийшов час навчитися самому їх створювати. За допомогою діалогових вікон JavaScript ви можете взаємодіяти з відвідувачем вашого сайту досить простим і тривіальним способом. Наприклад, ви можете запитувати ім’я відвідувача, а потім якось його відображати на сайті. Або ви можете зробити діалогове вікно з підтвердженням, яке дасть користувачам можливість вибору (виконувати чи ні вказану дію), наприклад чи входити на сайт з обмеженим доступом. Для цих цілей є три методи (команди) JavaScript, які ми сьогодні і розглянемо.

 

 

Діалогові вікна оповіщення, підтвердження і підказки

В JavaScript є три «команди», які створюють діалогові вікна оповіщення (alert), підтвердження (confirm) і підказки (prompt):

  • window.alert() або просто alert()
  • window.confirm() або просто confirm()
  • window.prompt() або просто prompt()

 

 

Тепер давайте розглянемо їх детально.

Перша команда – це оповіщення (або попередження):

window.alert()
// або просто alert()

 

Ця команда відображає діалогове вікно з таким повідомленням, яке ви сюди вставили. Це може бути, наприклад, простий статичний текст:

<body>
 <script type="text/javascript">
  window.alert("Вітаємо вас на нашому сайті!")
 </script>
</body>

 

У діалоговому вікні буде відображатися те, що ви вкажете в лапках. В наведеному вище прикладі це простий текст. Також це може бути результат виконання якоїсь функції (наприклад, з метою налагодження).

 

 

Друга команда – діалогове вікно з підтвердженням:

window.confirm()
// або просто confirm()

 

Це вікно використовується для підтвердження користувачем виконання певної дії і вибору між двома варіантами. Результат залежить від вибору користувача. Нижче простий приклад коду:

<script type="text/javascript">
 var confDialog = window.confirm("У вас сьогодні гарний настрій?")
 if (confDialog)
  window.alert("Чудово!")
 else
  window.alert("Погано :(")
</script>

 

Трохи розглянемо код вище. Перш за все, ми оголошуємо змінну (var confDialog), яка буде зберігати результат вікна підтвердження. Змінна confDialog отримає результат, а саме true (істина) або false (хиба). Потім ми використовуємо оператор if, щоб врахувати два шляхи, в залежності від результату. Якщо результат істинний (користувач натиснув «ОК»), буде показано діалогове вікно з оповіщенням «Чудово!». Якщо результат хибний (користувач натиснув «відмінити»), замість цього покажеться попередження «Погано :(».

 

 

Третя команда – діалогове вікно з підказкою:

window.prompt()
// або просто prompt()

 

Діалогове вікно з підказкою використовується для того, щоб дозволити користувачеві щось ввести і потім щось зробити з цією інформацією:

<script type="text/javascript">
 var promptDialog = window.prompt("Вкажіть, будь ласка, своє ім'я")
 window.alert(promptDialog)
</script>

 

Концепція тут дуже схожа. У діалоговому вікні ми запитуємо ім’я у користувача і після того як він його ввів, ми показуємо його в діалоговому вікні оповіщення. Ми також можемо вивести ім’я користувача не в вікні, а, наприклад, в якомусь блоці, використовуючи маніпуляції з DOM.

 

Ось і все на сьогодні. Дякуємо за увагу!

 

 

Напишіть тут свою думку/питання

Ваша пошта не публікуватиметься. Обов’язкові поля позначені *