Використання вікон та кадрів
Відкриття та закриття вікон
Відкриття вікон
Зауважимо, що Ви маєте можливість керувати самим процесом створення вікна. Наприклад, Ви можете вказати, чи має нове вікно мати рядок статусу, панель інструментів, меню або смуги прокручування. Крім того, Ви можете встановити розмір вікна. Розглянемо наступний приклад створення вікна розміром 250x100 пікселів, яке не має ні рядка статусу, ні панель інструментів, ні меню, ні смуги прокручування.
Як видно у прикладі, властивості вікна записані в рядку"w >, в якому слід звернути увагу на те, що вам не слід поміщати в ньому символи пропуску.
Закриття вікон
open() та close() - це методи об'єкта window. Ми повинні пам'ятати, що слід писати не просто open() та close() , а window.open() та window.close() . Однак у нашому випадку об'єкт window можна опустити - Вам немає необхідності писати префікс window , якщо Ви хочете лише викликати один з методів цього об'єкта (і таке можливе тільки для цього об'єкта).
Використання кадрів
Один із способів видати відразу кілька файлів HTML на екрані користувача – це відкрити кілька вікон броузера. Інший шлях полягає в тому, щоб розбити вікно на кілька розділів. Ці розділи називаються кадрами. У кожному кадрі відображається документ HTML. Кожен кадр може мати свої смуги прокручування, посилання, графічні зображення і т.д. Фрейми можуть функціонувати незалежно або впливати один на одного, використовуючи посилання, що вказують на інші кадри. Для використання кадрів необхідно як мінімум три файли: інсталяційний файл і два вихідні файли HTML. Інсталяційний файл призначає вихідні файли HTML для кожного вікна, але не містить власного тексту або графіки. Вихідні файли HTML видаються у кадри і, як і будь-якіінші файли можуть містити посилання, зображення, скрипти та ін. Для створення інсталяційного кадру необхідно два теги: і . HTML-сторінка, що створює кадри, у загальному випадку може виглядати так:
Наступний графік показує ієрархію кадрів. Усі три кадри мають того самого батька, навіть при тому, що два з кадрів визначені всередині окремого frameset. Це тому, що батько фреймів є батько вікно, і кадр, розташований не в frameset, визначає вікно. top +--listFrame (Category.html) +--contentFrame (Titles.html) +--navigateFrame (Navigate.html)
Ви можете звернутися до попередніх кадрів, використовуючи масив frames наступним чином. (Для інформації щодо масиву frames , дивіться об'єкт frame.)
- listFrame - top.frames [0]
- contentFrame - [1] top.frames
- navigateFrame - top.frames [2]
Приклад 2. Ви можете створювати вікно подібно до попереднього, але в якому вершина двох кадрів мають окремого батька з navigateFrame . Верхній рівень frameset буде визначено наступним чином:
Файл Muskel3.html містить такі твердження для верхніх кадрів і визначають frameset:
Наступний графік показує ієрархію кадрів. UpperFrame і navigateFrame з батьків: верхнє вікно. ListFrame і contentFrame з батьків: upperFrame . top +--listFrame (Category.html) +---upperFrame------ (muskel3.html) +--contentFrame (Titles.html) +---navigateFrame (Navigate.html)
Ви можете звертатися до попередніх кадрів, які використовують масив frames в такий спосіб. (Для інформації щодо масивів frames , дивіться об'єкт frame.)
- upperFrame - top.frames [0]
- navigateFrame - [1] top.frames
- listFrame - upperFrame.frames [0] або top.frames [0] .frames [0]
- contentFrame - upperFrame.frames [1] або top.frames [0] .frames [1]
Модифікація кадрів
Наприклад, нехай ви використовуєте frameset, описаний у Прикладі 2 у попередньому прикладі. Якщо ви хочете, щоб користувач був здатний закривати фрейм, що містить список artists (у фреймі listframe ) і проглядає тільки music titles, сортовані musician (в даний час у фреймі contentFrame ), ви можете додати наступну кнопку до navigateFrame .
Якщо Ви хочете, щоб користувач міг закрити фрейм, що містить список artists (у фреймі listframe ) і переглядаючи тільки music titles, сортовані musician (в даний час у фреймі contentFrame ), ви можете додати наступну кнопку до navigateFrame .
Коли користувач натискає цю кнопку, файл Artists.html завантажується у кадр upperFrame ; Фрейми listFrame і contentFrame закриваються і не існують.
Звернення та керування серед кадрів
Оскільки фрейми - це тип вікна, ви звертаєтеся до кадрів і переміщаєтеся серед кадрів як і з вікном. Дивіться також: звернення до вікон та кадрів та Управління вікнами
Приклад Фреймов
Файл navigate.html (навігаційні зв'язки внизу екрана) містить наступний код: Alphabetical By category Musician Descriptions
Файл Titles.html (головний файл, показаний у кадрі праворуч) містить наступний код:
Toshiko Akiyoshi
The Beatles
Please Please Me
Betty Carter
Ray Charles та Betty Carter.
Для більш детального створення кадру дивіться об'єкт frame.
Звернення до вікон та кадрів
Ім'я, яке ви використовуєте, щоб звернутися до вікна, залежить від того, чи звертаєтесь ви до властивостей, методів, та обробників події вікна або - звертаєтеся до вікна, як дорядку, що вказує на ім'я вікна підлеглої форми або гіперзв'язок.
Звернення до властивостей, методів та обробників події вікна
Для отримання додаткової інформації про ці методи звернення до вікна, дивіться об'єкт window.
Приклад 1: звернення до поточного вікна. Наступний вираз звертається до форми з ім'ям musicForm у поточному вікні. Вираз видає попередження, якщо перемикач вибраний. if (self.document.musicForm.checkbox1.checked)
Приклад 2: звернення до іншого вікна. Наступні вирази звертаються до форми з ім'ям musicForm у вікні checkboxWin. Вирази визначають, якщо вибрано перемикач, зазначає перемикач, визначать, якщо вибрано другу опцію об'єкта selected, вибирає другу опцію об'єкта selected. Навіть якщо значення об'єкта змінено в checkboxWin , поточне вікно залишається активним: перевірка перемикача і вибору опції відбору не дає фокус вікна. // Чи визначать чи перемикач if (checkboxWin.document.musicForm.checkbox2.checked) < alert('The checkbox on the musicForm in checkboxWin is checked!')>// Відзначає перемикач checkboxWin.document.musicForm.checkbox2.checked=true // Визначає, чи вибрана опція в об'єкті select if (checkboxWin.document.mu musicTypes.options[1].selected) // Вибирає опцію в об'єкті select checkboxWin.document.musicForm.musicTypes.selectedIndex=1
Приклад 3: Звернення до кадру в іншому вікні. Наступний вираз звертається до кадру з ім'ям frame2, що знаходиться у вікні з ім'ям window2. Вираз змінює колір фону frame2 на фіолетовий. Ім'я кадру frame2 має бути визначене в тезі <FRAMESET>, який створює frameset. Window2.frame2.document.bgColor = "violet"
Звернення до вікна підлеглої форми або гіперзв'язку
Використовуйте ім'я вікна, колизвертаєтеся до вікна, як до рядка, що вказує ім'я вікна підлеглої форми або гіперзв'язку (атрибут TARGET тегів <FORM> або <A>).
Приклад 1: Друге вікно. Наступний приклад створює гіперпосилання до другого вікна. У прикладі є кнопка, яка відкриває вікно з ім'ям window2 і зв'язок, який завантажує файл Doc2.html у відкрите вікно, і ще одна кнопка, яка закриває вікно.
Приклад 2:anchor у другому вікні. Наступний приклад створює гіперпосилання до anchor у другому вікні. Зв'язок відображає anchor з іменем numbers у файлі Doc2.html у вікні window2. Якщо window2 немає, його створює. numbers
Приклад 3: Фрейм ім'я. Наступний приклад створює гіперпосилання до anchor у кадрі. Зв'язок відображає anchor з ім'ям abs_method у файлі Sesame.html кадру з ім'ям "contentFrame". Фрейм повинен бути всередині поточного frameset, і ім'я кадру має бути визначене в атрибуті NAME тега <FRAME>. abs
Приклад 4: літеральне ім'я кадру. Наступний приклад створює гіперпосилання до файлу. Посилання відображає файл з ім'ям Artists.html у батьківському вікні поточного frameset. Цей об'єкт посилання з'являється у кадрі всередині frameset, і коли користувач натискає посилання, всі кадри в frameset зникають, і завантажується файл Artists.html у батьківське вікно. Musician Descriptions
Управління вікнами
Активне вікно – вікно, яке має фокус. Коли вікно має фокус, воно принесене на передній план і змінюється візуальним способом. Наприклад, область заголовка вікна може бути змінена різний колір. Візуальна команда виклику програми змінюється залежно від використовуваної платформи.
Приклад 1: надсилання фокусу об'єкту в інше вікно. Наступний вираз дає фокус текстовому об'єкту з ім'ям city у вікні checkbox Win. Так якТекстовий об'єкт отримує фокус, то checkboxWin також отримує фокус і стає активним вікном. У прикладі також показано вираз, який створює checkbox Win. сheckboxWin=window.open ("Doc2.html") . checkboxWin.document.musicForm.city.focus()
Приклад 2: передача фокусу до іншого вікна, при використанні гіперпосилання. Наступний вираз визначає window2 як target гіперпосилання. Коли користувач натискає посилання, фокус передається window2 . Якщо window2 не існує, воно створюється. Load a file into window2