Добавить в коллекции Добавить в сохраненное
  1. Без категории

frameset

реклама 
Учебный курс
Введение
в JavaScript и CGI
Лекция 2
Управление окнами
кандидат технических наук
Павел Брониславович Храмцов
[email protected]
Иерархия классов JavaScript
Window
self, parent, top
Самый старший класс JavaScript
navigator
plugins[]
mimeTypes[]
frames[]
location
history
document
forms[]
Массивы
документа
anchors[]
links[]
images[]
applets
embeds[]
layers[]
Packages[]
Встроенные массивы
браузера (программы и
поддерживаемые MIME-типы)
Фреймы окна – сами окна
Location – URL документа
История визитов
elements[] Элементы формы –
-Buttons
одни из
-Checkbox
основных
-FileUpload
объектов
-Hidden
-Password
программ
-Radio
JavaScript
-Reset
-Select
-Submit
-Text
-textarea
document
Вложенные
документы
2
Пример
<script>
document.write(window.location);
document.write("<br>");
document.write(document.location);
</script>
Результат исполнения
http://webclass.polyn.kiae.su/classes/jsi/objects.htm
http://webclass.polyn.kiae.su/classes/jsi/objects.htm
3
Пример
<script>
w=toString(window.location);
d=toString(document.location);
h=window.location.href;
document.write(w.length);
document.write(d.length);
document.write(h.length);
</script>
Результат исполнения window.location - 8
document.location - 8
window.location.href - 53
4
Объекты класса window
Свойства
Методы
•status
•location
•history
•navigator
•open
•close
•focus
События
Событий нет
5
Window: поле статуса
6
Window: поле статуса
Программируем status:
<a href=#status
onMouseover="window.status='Jump to status
description';return true;"
onMouseout="window.status='Status bar
programming';return true;">window.status</a>
Программируем DefaultStatus:
<body onLoad="window.defaultStatus='Status bar
programming';">
7
Программируем location
8
Программируем location
Свойства location:
http://kuku.ru:80/r/dir/page?search#mark
Методы location:
window.location.reload(true);
window.location.replace('#top');
9
История посещений страниц
<form>
<input type=button value=Назад
onClick=history.back()>
</form>
10
Тип браузера: Объект Navigator
<form><input type=button value="Тип навигатора"
onClick="window.alert(window.navigator.userAgent);">
</form>
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1;
.NET CLR 2.0.50727; .NET CLR 3.0.04506)
<script>
if(navigator.mimeTypes['image/gif']!=null)
document.write("Ваш браузер поддерживает GIF<br>");
if(navigator.mimeTypes['image/kuku']==null)
document.write("Ваш браузер не поддерживает
KUKU");
</script>
11
Методы управления окнами
alert()
confirm()
prompt()
open()
close()
focus()
setTimeout()
clearTimeout()
scroll()
blur()
12
Метод alert
<a href="javascript:window.alert('Кара-у-у-ул!!!')">Во
дворе злая собака</a>
13
Метод confirm
<form>
<input type=button value="Что вы знаете о
JavaScript?“ onClick="if(window.confirm('Знаю
все')==true)
{ document.forms[0].elements[1].value='Проверка на
вшивость';}
else
{document.forms[0].elements[1].value='Знал бы - не
читал';};"><br>
<input size=30>
</form>
14
Метод prompt
<form>
<input type=button value="Открыть окно ввода"
onClick= "document.forms[1].elements[1].value=
window.prompt('Введите чего-нибудь Христа
ради!');">
<input size=30>
</form>
15
Метод open
open("URL","window_name","param,...",replace);
где URL - страница, которая будет загружена в новое
окно,
window_name - имя окна, которое можно
использовать в атрибуте target в контейнерах A и
FORM,
replace - позволяет при открытии окна управлять
записью в массив history
16
Управление окнами
параметр
назначение
width
ширина окна в пикселях
height
высота окна в пикселях
toolbar
создает окно с системными кнопками
браузера
location
создает окно с полем location
directories
создает окно с меню предпочтений
пользователя
status
создает окно с полем статуса status
menubar
создает окно с меню
scrollbar
создает окно с линейками прокрутки
resizable
создает окно, размер которого можно
будет изменять после создания
17
Метод close
window.close();
self.close();
window.opener.close();
id=window.open();
...
id.close();
18
Метод focus
function myfocus(a) {
id = window.open("","example","scrollbars,width=300,height=200");
if(a==1) {
id.document.open();
id.document.write("<center>Открыли окно в первый раз"); }
if(a==2) {
id.document.open();
id.document.write("<center>Открыли окно во второй раз"); }
if(a==3) {
id.focus();
id.document.open();
id.document.write("<center>Открыли окно во второй раз"); }
id.document.write("<form><input type=button
onClick='window.close();' value='Закрыть окно'></center>");
id.document.close();
}
19
Метод setTimeout
idt = setTimeout("JavaScript_код",Time);
var flag=0;var idp=null;
function myclock() {
if (flag==1) {
d = new Date();
window.document.c.f.value =
d.getHours()+":"+d.getMinutes()+":"+d.getSeconds(); }
idp=setTimeout("myclock();",500); }
function flagss() {
if(flag==0) flag=1; else flag=0; }
...
<form name=c>
Текущее время:<input name=f size=8><input type=button
value="Start/Stop" onClick=flagss()></form>
20
Метод clearTimeout
var idp1 = null;
function start() {
d = new Date();
window.document.c1.f1.value =
d.getHours()+":"+d.getMinutes()+":"+d.getSeconds();
idp1=setTimeout("start();",500); }
function stop() {
clearTimeout(idp1);idp1=null; }
...
<form name=c1>
Текущее время:<input name=f1 size=8>
<input type=button value="Start"
onClick="if(idp1==null)start();">
<input type=button value="Stop"
onClick="if(idp1!=null)stop();">
</form>
21
Фреймы
Именование фреймов
top.frames[1].images[1].src="kuku.gif";
или
top.right.images[1].src="kuku.gif";
Передача фокуса
window.open("./framer.htm","mytop");
self.top.frames[2].document.open();
self.top.frames[2].document.close();
22
Фреймы
top (_parent)
<html>
<head>
</head>
<frameset cols="50%,*">
<frame name=left src=./left.htm>
<frame name=right src=./right.htm>
</frameset>
</html>
top (_parent)
left
left
right
right
23
Фреймы
top (_parent)
<frameset cols="50%,*">
<frame name=left src=./left.htm>
<frameset rows="50%,*">
<frame name=top src=./top.htm>
<frame name=bottom src=./bottom.htm>
</frameset>
</frameset>
left
top (_parent)
top
bottom
top
left
bottom
24
Фреймы
Первый документ:
top (_parent)
<html><head></head>
<frameset cols="50%,*">
<frame name=left src=./left.htm>
<frame name=right src=./right.htm>
</frameset>
</html>
Второй документ (right.htm):
<html><head></head>
<frameset rows="50%,*">
<frame name=top src=./top.htm>
<frame name=bottom src=./bottom.htm>
</frameset>
</html>
left
right
top
bottom
25
Именование фреймов
<html>
<head>
...
</head>
<frameset cols="20%,*">
<frame name=left src=frame1.htm>
<frame name=right src=frame2.htm>
</frameset>
</html>
top.frames[1].images[1].src="kuku.gif";
или
top.right.images[1].src="kuku.gif";
26
Именование фреймов
<frameset rows="20,*,20">
<frame name=top src=top.htm>
<frameset cols="50,*,50">
<frame name=left src=left.htm>
<frame name=center src=center.htm>
<frame name=right src=right.htm>
</frameset>
<frame name=bottom src=bottom.htm>
</frameset>
frame[0] (top)
frame[1] (left)
frame[2] (center)
frame[3] (right)
frame[4] (bottom)
27
Именование фреймов
<frameset cols="20,*,20">
<frame name=left src=top.htm>
<frameset rows="50,*,50">
<frame name=top src=left.htm>
<frame name=center src=center.htm>
<frame name=bottom src=right.htm>
</frameset>
<frame name=right src=bottom.htm>
</frameset>
frame[1] (top)
frame[0] (left)
frame[2] (center)
frame[1] (right)
frame[1] (bottom)
28
Передача фокуса в фрейм
function load() {
if(self.document.f.s.options[document.f.s.selectedIndex].text=="top") {
document.f.target = "mytop";
self.top.frames[2].document.open();
self.top.frames[2].document.close(); else {
document.f.target = "mybottom";
self.top.frames[1].document.open();
self.top.frames[1].document.close(); }
return true; }
29
Передача фокуса в фрейм
function load() {
if(self.document.f.s.options[document.f.s.selectedIndex].text=="top") {
window.open("./framer.htm","mytop");
self.top.frames[2].document.open();
self.top.frames[2].document.close(); }
else {
window.open("./framer.htm","mybottom");
self.top.frames[1].document.open();
self.top.frames[1].document.close(); }
return false;
}
30
Похожие документы
ПРАКТИЧЕСКАЯ РАБОТА 8
ПРАКТИЧЕСКАЯ РАБОТА 8
ОАО « БИНБАНК»
ОАО « БИНБАНК»
Джон Браннер
Джон Браннер
Е. В. Колесникова Программа jetdraft document suite 2008 как
Е. В. Колесникова Программа jetdraft document suite 2008 как
Тест по JavaScript
Тест по JavaScript
Создание фильтров для анализа каротажных данных в Petrel
Создание фильтров для анализа каротажных данных в Petrel
Заявка на сервисное обслуживание
Заявка на сервисное обслуживание
Скачать
реклама