JavaScript — Диалоговые окна

JavaScript поддерживает три важных типов диалоговых окон. Эти диалоговые окна могут быть использованы для вызывания исключения и оповещения, или получить подтверждение на любом входе или иметь вид ввода от пользователей. Здесь мы обсудим каждое диалоговое окно по очереди.
Диалоговое окно alert
Диалоговое окно alert в основном используется для того чтобы дать предупреждение пользователям. Например, если в поле необходимо ввести текст, но пользователь не вводит, то как часть проверки, вы можете использовать окно предупреждения, чтобы сделать предупреждение.
Тем не менее, окно предупреждения по-прежнему можно использовать для дружелюбных сообщений. Окно оповещения дает только одну кнопку «OK», чтобы продолжить.
Пример
<html>
<head>
<script type="text/javascript">
<!--
function Warn() {
alert ("Это предупреждающее сообщение!");
document.write ("Это предупреждающее сообщение!");
}
//-->
</script>
</head>
<body>
<p>Нажмите следующую кнопку, чтобы увидеть результат: </p>
<form>
<input type="button" value="Click Me" onclick="Warn();" />
</form>
</body>
</html>Диалоговое окно confirmation
Диалоговое окно confirmation в основном используется для согласие пользователя на любой вариант. Оно отображает диалоговое окно с двумя кнопками: OK и Cancel.
Если пользователь нажимает на кнопку OK, функция confirm() возвращает окну true. Если пользователь нажимает на кнопку Cancel, то функция confirm() возвращает false. Вы можете использовать диалоговое окно подтверждения следующим образом:
Пример
<html>
<head>
<script type="text/javascript">
<!--
function getConfirmation(){
var AndreyExVal = confirm("Хотите продолжить?");
if( AndreyExVal == true ){
document.write ("Пользователь хочет продолжить!");
return true;
}
else{
document.write ("Пользователь не хочет продолжать!");
return false;
}
}
//-->
</script>
</head>
<body>
<p>Нажмите следующую кнопку, чтобы увидеть результат: </p>
<form>
<input type="button" value="Click Me" onclick="getConfirmation();" />
</form>
</body>
</html>Диалоговое окно prompt
Диалоговое окно prompt полезно, если вы хотите, чтобы появилось всплывающее текстовое поле, для получения пользовательского ввода. Таким образом, это позволяет взаимодействовать с пользователем. Пользователь должен заполнить поле и нажмите кнопку ОК.
Это диалоговое окно, используя функция prompt(), которая принимает два параметра: 1. Метка, которую вы хотите отобразить в текстовом поле и 2. Строка, по умолчанию для отображения в текстовом поле.
Это диалоговое окно содержит две кнопки: OK и Cancel. Если пользователь нажимает кнопку OK, функция prompt() возвращает окну введенное значение из текстового поля. Если пользователь нажимает на кнопку Отмена, функция prompt() возвращает окну null.
Пример
В следующем примере показано, как использовать диалоговое окно с запросом:
<html>
<head>
<script type="text/javascript">
<!--
function getValue(){
var retVal = prompt("Введите ваше имя : ", "your name here");
document.write("Вы вошли : " + retVal);
}
//-->
</script>
</head>
<body>
<p>Нажмите следующую кнопку, чтобы увидеть результат: </p>
<form>
<input type="button" value="Click Me" onclick="getValue();" />
</form>
</body>
</html>