На многооконной странице с фреймом информационное взаимодействие между подокнами является обычным явлением. Если щелкнуть гиперссылку в окне навигации, как открыть связанную веб-страницу в другом окне? Если я нажму кнопку в этом окне, смогу ли я написать сообщение в другом окне? Окон так много, как их идентифицировать? См. пример ниже.
1. Нажмите ссылку в окне навигации, чтобы открыть веб-страницу в другом окне.
Существующая однокадровая страница показана на рисунке выше. Окно A — это логотип и реклама веб-сайта, окно B — панель навигации, а окно C — окно, в котором отображается страница. Исходный код этой страницы в рамке:
| <framesetrows=20%,*> <framename=topFramesscrolling=NOnoresizesrc=toppage.htm> <framesetcols=18%,*> <framename=leftFramenoresizesrc=leftpage.htm> <framename=mainFramesrc=mainpage.htm> </frameset> </frameset> |
Если страницу ссылки (test.htm) в окне B необходимо открыть в окне C, то ссылку в окне B следует записать следующим образом: <a herf=test.htm target=mailFrame> Страница этой ссылки должна быть открываться в окне C. </a>, ключевую роль здесь играет целевой параметр в теге <A>. Если вы хотите открыть веб-страницу в этом окне, установите имя этого окна в параметре Target.
2. Нажмите кнопку в окне B и напишите строку текста в окне C.
Формат страницы в этом примере такой же, как и в предыдущем примере. Готовый эффект следующий: После нажатия кнопки «Написать в окне C» в окне B появляется строка текста «Привет! Привет! Это через Words, написанный для». Управление окном B». Код страницы в рамке и файлов веб-страницы в каждом окне такой же, как в приведенном выше примере.
Способ приготовления:
1. Вставьте следующую программу Javascript между исходным кодом <head> и </head> веб-страницы окна C (mainpage.htm):
| <scriptlanguage=Javascript> <!-- функцияhtest(){ document.write(Привет! Привет! Это слово, написанное через элемент управления окном B.) } --> </скрипт> |
Функция этой программы - написать текст в текущем окне.
2. Так как же вызвать программу из окна С в окне Б? Сначала посмотрите исходный код кнопки «Записать в окне C» в окне B:
| <inputtype=buttonvalue=Запись в окне C onclick=parent.mainFrame.htest()> |
В этом коде ключевым является код «parent.mainFrame», который вводит новое понятие — структурные отношения окон, то есть на многооконной странице отношения между окнами определяются по каким принципам. Принцип определения связи окон таков: окно, отделенное от текущего окна, является «дочерним окном» (дочерними элементами) текущего окна, затем текущее окно является «родительским окном» (родителем) разделенного окна. Например, связь между окнами в этом примере следующая:
Как видно из приведенной выше таблицы, «окно браузера» является «родительским окном» «topFrame» и «нижнего окна», а нижнее окно является «родительским окном» двух окон «leftFrame» и «mainFrame». ". Соединение между двумя окнами должно осуществляться через их родительские окна, поэтому в этом примере вызов «htest()» на веб-странице в окне C, очевидно, осуществляется через родителей C и B, а затем к mainFrame, и затем вызовите программу htest().
Итак, если код записи текста из окна C в окно B такой: onclick=parent.leftFrame.htest(), то знаете ли вы, как написать код записи фрагмента текста из окна A в окно C; ? Кстати, вот и все: onclick=grandchildren.mainFrame.htest().
Как видно из приведенного выше примера, ключевой проблемой обмена информацией между окнами является понимание взаимоотношений между окнами, а другие операции относительно просты.