Спливаючі вікна JavaScript

• Квітня 23, 2024

JavaScript був розроблений для додавання інтерактивності до веб-сторінок, тому не дивно, що він має кілька функцій, щоб спростити збирання інформації та відображення її користувачеві за допомогою спливаючих вікон. Перш ніж ми розглянемо ці поля, майте на увазі, що хоча це найчастіше найпростіший спосіб збирання та відображення інформації, вони не обов'язково є найпривабливішим або зручним для користувачів. Крім усього іншого, спливаючі вікна вимагають від користувача натиснути кнопку, щоб закрити вікно після кожного повідомлення або введення - це може швидко постаріти. Крім того, з точки зору веб-дизайну, у вас дуже мало контролю над поданням інформації у спливаючих вікнах. Однак, у потрібному місці та використовуваному в помірній кількості спливаючі вікна можуть бути простими та ефективними.

Існує три типи спливаючих вікон - попередження, підтвердження та підказки. Найпростіший і найчастіше використовується спливаюче вікно - це попередження. Повідомлення бере один аргумент - повідомлення для користувача. Коли спливає вікно сповіщення, користувач не може продовжувати, поки не натисне кнопку "ОК". Код вікна оповіщення простий:

попередження ("Це попередження")



Поле для підтвердження лише трохи складніше. Як і попередження, підтвердження бере один аргумент - повідомлення. Коли з’являється вікно підтвердження, користувачеві надається вибір відповіді за допомогою кнопок «ОК» або «Скасувати». На відміну від попередження, підтвердження має значення повернення - 0 означає, що користувач натиснув "Скасувати", а 1 означає "ОК". Код поля підтвердження ідентичний вікні попередження, за винятком того, що ви хочете якось зібрати повернене значення:

save_me = підтвердити ("Це спливаюче вікно підтвердження")



Хоча це і є найскладнішим із спливаючих вікон, підказка все ще досить проста. Запрошення містить два аргументи - повідомлення користувачеві та значення за замовчуванням (або "" якщо ви не бажаєте значення за замовчуванням.) Коли з'явиться вікно запиту, користувач може ввести потрібну інформацію та натиснути "ОК". Також є кнопка «Скасувати». Повернене значення - це відповідь користувача. Якщо користувач скасовує, значення повернення є нуль. Якщо вони залишать поле запиту порожнім, значенням повернення буде порожній рядок (""). Ймовірно, ви хочете перевірити ці значення і зробити щось особливе, а не використовувати нуль або порожній рядок як їх відповідь. Код вікна підказки:

response = prompt ("Це підказка", "Відповісти тут")



Демонстрацію цих спливаючих вікон ви можете переглянути тут

---

Відео Інструкція: Уроки JavaScript Практика #6 Учимся делать модальные окна (Квітня 2024).