2013-09-15 4 views
0

Одним из моих назначений для моего класса веб-дизайна является создание страницы, в которой два фрейма обмениваются данными с использованием JavaScript. Есть четыре ссылки на нижнем фрейме (lower2.html), и при нажатии они должны изменить изображение в верхнем фрейме (upper1.html) на соответствующее изображение, но это не так. Вот что у меня есть:Новичка JavaScript/HTML Frame Communication

Имя файла: js-seveneen.html. Это тот, который я выполняю.

<HTML> 
<HEAD> 
<TITLE>HTML and JavaScript</TITLE> 
</HEAD> 
<FRAMESET ROWS="140,*"> 
<FRAME NAME="upperFrame" SRC="upper1.html"> 
<FRAME NAME="lowerFrame" SRC="lower2.html"> 
</FRAMESET> 
</HTML> 

Имя файла: upper1.html. Это верхний кадр, который отображает изображения.

<HTML> 
<HEAD> 
<TITLE>HTML and JavaScript</TITLE> 
</HEAD> 
<BODY> 
<CENTER> 
<IMG NAME="upperImage" SRC="lions.gif"> 
</CENTER> 
</BODY> 
</HTML> 

Имя файла: lower2.html. Это нижний фрейм, содержащий ссылки, которые должны изменить изображения, но не нужно. Независимо от того, что я нажимаю, он остается на умолчанию lions.gif.

<HTML> 
<HEAD> 
<TITLE>HTML and JavaScript</TITLE> 
<SCRIPT> 
function setImage(number) 
{ 
if (number==1) 
{ 
    parent.upperFrame.document.upperImage.src="lions.gif"; 
} 
if (number==2) 
{ 
    parent.upperFrame.document.upperImage.src="tigers.gif"; 
} 
if (number==3) 
{ 
    parent.upperFrame.document.upperImage.src="bears.gif"; 
} 
if (number==4) 
{ 
    parent.upperFrame.document.upperImage.src="ohmy.gif"; 
} 
return; 
} 
</SCRIPT> 
</HEAD> 
<BODY> 
<CENTER> 
<H2>IMAGE LIST</H2> 
<TABLE> 
<TR><TD><A HREF="javascript:setImage(1)">1: LIONS.GIF</A></TD></TR> 
<TR><TD><A HREF="javascript:setImage(2)">2: TIGERS.GIF</A></TD></TR> 
<TR><TD><A HREF="javascript:setImage(3)">3: BEARS.GIF</A></TD></TR> 
<TR><TD><A HREF="javascript:setImage(4)">4: OHMY.GIF</A></TD></TR> 
</TABLE> 
</CENTER> 
</BODY> 
</HTML> 

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

+0

выглядит как материал 20-го века, Мне жаль тебя. фреймы в коллекции объектов Windows называются фреймами, поэтому попробуйте что-то вроде parent.frames ['upperframe']. document.images [0] .src - im не уверен, что это сработает, просто попробуйте - поскольку это сейчас совершенно бесполезно и устаревшие вещи. – magyar1984

+0

Это не работает, но спасибо в любом случае. Я понимаю, что хорошая практика проектирования заключается в том, чтобы избежать фреймов в целом, но меня обучают из книги, в которой говорится, что я могу использовать Netscape для поиска информации и которая объясняет, как Oracle, Sun и Microsoft конкурируют с ней, чтобы создать лучший браузер. :) – HEATH3N

+0

, если вы можете позволить себе купить несколько новых вещей, и вы хотите сделать веб-дизайн - инвестируйте в книги, если вам просто нужны кредиты, чем в порядке;) – magyar1984

ответ

0

JavaScript в основном работает в идентификаторах. top дает вам главное окно.

Добавить ID атрибутов в кадр и теги изображений

<frame id="upperFrame" name="upperFrame" > 

Вы также можете получить доступ к кадра по индексу

top.frames[0].document. ,,, 

Читать www.w3schools.com материал. Также фреймы были покончены в HTML5 так считает изучение фреймов

Присвоить идентификаторы кадра и изображения, а также, сделать ID же, как имя и попробовать что-то вроде этого

top.frames["upperFrame"].document.getElementById["imageIdNotName"].src = 'new value'; 
+0

Я буквально только начал изучать это несколько дней назад. Где бы я нашел идентификатор изображения, или я бы дал его с помощью . Кроме того, что будет представлять значение в вашем примере? Я понимаю, что этот сайт, вероятно, не для таких любительских вопросов, как я, но я ценю вашу помощь. – HEATH3N

+0

Обновляет свой ответ. – fahadash

+0

Добавлены идентификаторы кадра и изображения, по-прежнему не повезло. Возможно ли, что код больше не поддерживается? – HEATH3N