JavaScript всплывающие окна

• April 26, 2024

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

Существует три типа всплывающих окон - оповещение, подтверждение и подсказка. Самое простое и наиболее часто используемое всплывающее окно - это оповещение. Оповещение принимает один аргумент - сообщение для пользователя. Когда появляется окно с предупреждением, пользователь не может продолжить, пока не нажмет кнопку «ОК». Код для окна предупреждения прост:

оповещение («Это оповещение»)



Окно подтверждения только немного сложнее. Как предупреждение, подтверждение принимает один аргумент - сообщение. Когда появляется окно подтверждения, пользователю предоставляется выбор ответа с помощью кнопок «ОК» или «Отмена». В отличие от оповещения, подтверждение имеет возвращаемое значение - 0 означает, что пользователь нажал «Отмена», а 1 означает «ОК». Код для поля подтверждения идентичен окну предупреждения, за исключением того, что вы хотите каким-то образом получить возвращаемое значение:

save_me = Подтвердить («Это всплывающее окно подтверждения»)



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

response = prompt («Это приглашение», «Ответить здесь»)



Вы можете посмотреть демонстрацию этих всплывающих окон здесь

---

Видео инструкция: Практика JavaScript. Задача #5. Делаем всплывающее окно. Modal window. (April 2024).