 |
Главная Случайная страница Контакты | Мы поможем в написании вашей работы! | |
Передача данных во фрейм
|
|
Обычной задачей при разработке типового Web-узла является загрузка результатов исполнения CGI-скрипта во фрейм, отличный от фрейма, в котором вводятся данные для этого скрипта. Если путь загрузки результатов фиксированный, то можно просто использовать атрибут TARGET формы. Сложнее, если результат работы должен быть загружен в разные фреймы (например, в зависимости от выбранной кнопки).
Применим полученные нами знания для решения этой задачи. Сначала заготовим следующие файлы. Основной файл, например,index. htm, содержит левый фрейм, в котором будет находиться форма, и правый фрейм, разбитый на два подфрейма (верхний и нижний). Файл left. htm содержит форму, в которой пользователю предоставляется возможность выбрать верхний или нижний фрейм и нажать кнопку "Загрузить". Файл right. htm содержит простой текст; он будет загружаться в верхний или нижний фрейм, в зависимости от действий пользователя.
| Основной файл с тремя фреймами | Файл с формой left. htm в левом фрейме | Файл right. htm |
| <HTML><HEAD><TITLE>Три фрейма</TITLE></HEAD> <FRAMESET COLS="50%,*"> <FRAME NAME=leftframe SRC=left.htm> <FRAMESET ROWS="50%,*"> <FRAME NAME=topframe SRC=""> <FRAME NAME=botframe SRC=""> </FRAMESET> </FRAMESET></HTML> | <HTML><HEAD><SCRIPT SRC="loadframe.js"></SCRIPT></HEAD><BODY> <FORM METHOD=post ACTION=right.htm NAME=f onSubmit="return load();"> <SELECT NAME=s> <OPTION>верхний</OPTION> <OPTION>нижний</OPTION> </SELECT> <INPUT TYPE=submit VALUE="Загрузить"> </FORM></BODY></HTML> | <HTML><BODY> Этот документ мы загружаемпри выборефреймаиз списка </BODY></HTML> |
Для того, чтобы пример заработал, остается в файле loadframe.js описать функцию load (). Функция должна делать так, чтобы в зависимости от выбора пользователем значения селектора "верхний" или "нижний" файл right. htm загружался бы либо в правый верхний, либо в правый нижний фрейм. С этой целью в файле left. htm у формы не был указан целевой фрейм (атрибут TARGET).
Нашу задачу динамического выбора фрейма можно решать по-разному. Более изящный способ - переназначать "на лету" свойство target, с него мы и начнем (открыть).
function load(){if(document.f.s.selectedIndex==0) { document.f.target = "topframe"; top.frames[2].document.open(); top.frames[2].document.close(); }else { document.f.target = "botframe"; top.frames[1].document.open(); top.frames[1].document.close(); }return true;}4.8. Файл loadframe.js: переназначение target на лету
Функция load () всегда возвращает true, а поскольку она вызывается из обработчика события onSubmit, это означает, что всегда будет происходить отправка формы (событие Submit), т.е. загрузка страницы right. htm, указанной в атрибуте ACTION данной формы. Обратите внимание также на следующие строки в функции load ():
top.frames[1].document.open(); top.frames[1].document.close();Смысл их таков: когда пользователь выбирает значение верхний или нижний в форме, то файл right. htm загружается в соответствующий фрейм, а оставшийся фрейм открывается на запись (методом...document.open(), при этом всё его содержимое очищается) и закрывается (методом...document.close()), тем самым фрейм остаётся пустым (без текста).
Теперь рассмотрим второй подход - открытие окна с именем, совпадающим с именем фрейма topframe или botframe. Его идея состоит в том, что при попытке открыть окно с именем существующего окна новое окно не открывается, а используется уже открытое. Фрейм - это тоже окно, поэтому на него данное правило распространяется. Функция, реализующая такое поведение, приведена ниже (открыть):
function load(){ if(document.f.s.selectedIndex==0) { window.open("right.htm","topframe"); top.frames[2].document.open(); top.frames[2].document.close(); } else { window.open("right.htm","botframe"); top.frames[1].document.open(); top.frames[1].document.close(); }return false;}4.9. Файл loadframe.js: использование window.open()
В этом подходе функция load () всегда возвращает false. Это необходимо, чтобы отменить отправку данных формы: ведь после того, как мы вызвали window.open(), в отправке данных формы, т.е. загрузке файла right. htm, уже нет надобности.
Дата публикования: 2015-01-24; Прочитано: 304 | Нарушение авторского права страницы | Мы поможем в написании вашей работы!
