На цьому уроці ми познайомимося з методами об'єкта window: alert(), prompt() та confirm().

Метод alert()

Метод alert() призначений для виведення на екран користувача попереджувального діалогового вікна із зазначеним повідомленням та кнопкою "ОК". Воно може використовуватися для того, щоб донести до користувача важливу інформацію.

window.alert(Параметр_1);

Метод alert() має один обов'язковий параметр – це текст повідомлення, яке відображається у діалоговому вікні. Даний метод внаслідок свого виконання нічого не повертає.

Наприклад, виведемо для відвідувача сайту при натисканні на посилання попереджувальне діалогове вікно: Перейти на сайт

Метод confirm() Метод confirm() об'єкта window призначений для виведення на екран користувача діалогового вікна із зазначеним повідомленням та кнопками "ОК" та "Скасувати". Вікно з підтвердженням можна використовувати, щоб запросити користувача дозволу на виконання тієї чи іншої дії.

var resultConfirm = confirm(Параметр_1);

Даний метод має один параметр – це текст повідомлення, яке буде виведено у діалогове вікно.

Метод confirm() як результат (resultConfirm) свого виконання повертає одне з двох значень:

• true якщо користувач натиснув "ОК";
• false , якщо користувач натиснув "Скасувати" або закрив його.

Наприклад, виведемо в елемент id="resultConfirm" результат натискання користувачем на кнопку "ОК" у діалоговому вікні:

var resultActionUser = confirm("Користувач, будь ласка, натисніть на кнопку ОК."); if (resultActionUser) ( document.getElementById("resultConfirm").innerHTML = "Користувач, дякую що Ви натиснули на кнопку ОК"; ) else ( document.getElementById("resultConfirm").innerHTML = "Користувач, ми розчарувалися у Вашій відповіді ";)

Метод prompt()

Метод prompt() призначений для виведення на екран користувача діалогового вікна з повідомленням, текстовим полем для введення даних та кнопками "ОК" та "Скасувати". Воно призначене для того, щоб запитати дані користувача.

var resultPrompt = prompt(Параметр_1, Параметр_2);

Цей метод має два параметри:

• повідомлення, яке буде виведено у діалоговому вікні. Цей параметр є обов'язковим і містить повідомлення, в якому "говориться", які дані повинен ввести користувач у текстове поле;
• другий параметр є необов'язковим і може бути використаний для вказівки початкового значення, яке буде виведено в поле введення діалогового вікна при відкритті.

Залежно від дій користувача метод prompt() може повертати такі дані:

• текстове значення - якщо поле введення містяться дані і користувач натиснув "ОК";
• порожній рядок - якщо у полі введення не містяться дані та користувач натиснув "ОК";
• null - якщо користувач натиснув "Скасувати" або закрив це вікно, при цьому не важливо, які дані були введені в текстове поле.

Примітка: діалогове вікно, яке з'являється в результаті виконання одного з методів alert() , confirm() або prompt() модальне, тобто. воно блокує доступ користувача до батьківського додатку (браузеру) доти, доки користувач не закриє це діалогове вікно.

Наприклад, запитаємо у користувача ім'я і виведемо залежно від результату текст елемент c id="nameUser" :

var nameUser = prompt ("Введіть своє ім'я?"); if (nameUser) ( document.getElementById("nameUser").innerHTML = nameUser +", ласкаво просимо на сайт!"; ) else ( document.getElementById("nameUser").innerHTML = "Гість, ласкаво просимо на сайт!" ;)

Наприклад, попросимо користувача вгадати число 8:

function guessNumber() ( var findNumber = prompt ("Вгадай число від 1 до 10?"); switch (findNumber) ( case "6": alert("Вже тепліше!"); break; case "7": alert(" Гаряче!"); break; case "8": alert("Ти вгадав! Це число 8."); break; case "9": alert("Вже тепліше!"); break; default: alert("Холодно! "); break; )) ... Вгадай число

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

Функція JavaScript alert() дозволяє отримати ствердну відповідь. По суті важлива не відповідь, а сам факт виведення інформації. Причому веб-ресурс перестає функціонувати доти, доки користувач не відгукнеться. Відповідь за алертом завжди одна - це відповідь!

Для налагодження JavaScript alert() - ідеальний засіб, який дозволяє швидко отримати актуальну інформацію, прийняти рішення та продовжити роботу. Але з метою звичайного функціонування сайту він також має неабияку кількість переваг.

Фіксація уваги відвідувача

"Алерт" - як у житті, формує подію, повз яку ніяк не пройти. Але ця подія може і не статися.

Рідкісний розробник знає про цю обставину і болісно довго налагоджує свій сайт у його клієнтській частині. При цьому мало хто з розробників не знає: знайти помилку в клієнті, тобто в браузері, часто так важко, що:

• безцільно йде годинник дорогоцінного часу;
• витрачаються неймовірні трансформації коду;
• перелопачується маса скриптів, на словах, дістається і браузеру, і серверу.

А результату все нема. Ні дебаггери не допомагають, ні слова, ні вбудовані у будь-який браузер інструменти для налагодження. Тим часом скринька завжди просто відкривається - важливий правильний ключик.

Просте правило правильного коду

Насамперед, куки стали найбільш затребуваною складовою сучасного сайту. Слід ніколи не забувати:

• JavaScript alert & document cookie
• "тут і зараз" & "взагалі або коли-небудь".

Кукі - це класна можливість пам'ятати в надрах браузера про кожного клієнта, але не слід надавати цьому значення у поточному сеансі. Головна турбота куки: залишитися в «пам'яті» браузера у тому змісті, який вона мала на момент відходу відвідувача.

У всьому іншому код скрипта в надрах браузера залежить тільки від самого себе та подій, які він обробляє.

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

Простіше простого застосувати:

• JavaScript alert("Досі було все правильно!").

Найкращий дебагер або відладчик - подія, яка має відбутися, але не відбувається.

Переміщаючи цю конструкцію вниз від нуля до прикрого криміналу в коді можна виявити місце, після якого вона не працює. Помилка буде знайдена. JavaScript alert() - це модальне вікно. Його обійти ніяк не можна, і далі нічого не буде, поки розробник/відвідувач не закриє вікно.

Якщо вікно не вискакує, значить або воно позначене в коді неправильно, або все, що йде до нього, містить помилку.

Складна ситуація, в якій alert JavaScript начебто не спрацьовує

В основному це стосується алгоритмів AJAX обміну інформацією з сервером. Тут не завжди допустимо застосовувати класичні засоби налагодження, а коли на стороні клієнта діє багаторівнева система об'єктів, то налагодження взагалі трансформується у свідомість розробника і ніякий дебаггер не може допомогти.

Найкращий варіант алерту в процедурі спілкування з сервером - це див (div), в якому міститься протокол спілкування з сервером за методом innerHTML - завжди буде ясно, на якому етапі відбувається проблема.

Статичний див, який завжди видно на сторінці – це не модальне вікно від JavaScript alert. Window може з'явитися, і причин цього може бути безліч, причому оформлених синтаксично правильно. Мова браузера відрізняється гранично спокійною вдачею і ніколи не зробить будь-яких дій, якщо чогось не розібрав і не зрозумів.

Статичність будь-якого HTML-тега - хороший фактор. Прибрати весь код і додавати його порціями, поки помилка знову не виникне, - не найшвидша технологія налагодження. Писати правильно - порада популярна, затребувана, але не практична.

Мова браузера – працює за подіями, його основна турбота – не послідовний код, а виконання функціональності, призначеної на теги сторінки, та обробка подій.

Додаткове правило до простого правила

Якщо вікно від JavaScript alert("Досі все написано правильно") не з'явилося в браузері, значить, синтаксис до місця, де ця конструкція записана, не викликає у браузера сумнівів і виконаний правильно.

Логіка сучасного стилю письма має істотний недолік. Всі файли сторінки зливаються воєдино (зі своєю суттю та типами) в одне ціле, і після цього будується DOM. Порядок з'єднання файлів часто має важливе значення.

Найкраще, коли розробник не надає значення принципу організації виконання функцій, призначених на події, а має всі функції в послідовності їх застосування і призначення на теги і події сторінки.

Порядок завжди найважливіший. З рештою JavaScript розбереться сам: що і коли викликати. Сучасне програмування взагалі й у контексті будь-якого методу, будь-якого високоорганізованого объектно-ориентированного підходу зокрема - завжди послідовно. об'єднуються завжди теж послідовно в міру опису.

Якщо щось не відбувається, значить, не десь щось не так, а лише перед цим місцем.