КАТЕГОРИИ:
Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748)
Листинг 4.4. Файл chapter4/Converter/toc. html
|
|
|
|
Листинг 4.3. Файл chapter4/Converter/main. html
Листинг 4.2. Файл chapter4/Converter/title. html
Листинг 4.1. Файл chapter4/Converter/index. htm
<HTML>
<HEAD>
<ТIТLЕ>Десятично-шестнадцатеричный перетворювач</ТIТLЕ>
</HEAD>
<FRAMESET ROWS="85,*" FRAMEBORDER=1>
<FRAME SCROLLING="no" NAME="title" SRC="title.html" MARGINHEIGHT="1">
<FRAMESET COLS="180,*" FRAMEBORDER=1>
<FRAME SCROLLING="auto" NAME="toc" SRC="toc.html">
<FRAME SCROLLING="auto" NAME="mainpage" SRC="main.html">
</FRAMESET>
<NOFRAME>
<BODY BGCOLOR="#FFFFFF"> </BODY>
</NOFRAME>
</FRAMESET>
</HTML>
Сценарій будет працювати з фреймами toc і mainpage, розташованими відповідно у файлах з іменами toc. html і main. html. У файлі title. html розташовується заголовок (листинг 4.2).
<HTML>
<HEAD>
<ПОЗНАЧКА HTTP-EQUIV="Content-Type" CONTENT="text/html;
charset=windows-1251">
</HEAD>
<BODY BGCOLOR="#ffffff">
<TABLE>
<TR> <TD> <Н2>Десятично-шестнадцатеричный перетворювач</H2> </TD>
</TR>
</TABLE>
</BODY>
</HTML>
Вихідний текст документа, що містить форму з полями Dec і Hex, поданий у листинге 4.3.
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;
charset=windows-1251">
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<FORM NAME="Sel">
<TABLE>
<TR>
<TD><B>Hex: </B></TD>
<TD><INPUT TYPE="text" NAME="hexValue" SIZE="20" onFocus=" this. blur();"></td>
</TR>
<TR>
<TD><B>Dec:</B></TD>
<TD><INPUT TYPE="text" NAME="decValue" SIZE="20"></TD>
</TR>
</FORM>
</BODY>
</HTML>
Для поля вихідного десяткового числа за допомогою параметра NAME задане ім'я decValue. Поле результату називається hexValue. Ці імена використовуються сценарієм JavaScript для адресации поляж.
Документ toc. html (листинг 4.4) містить форму з кнопками і сценарій JavaScript.
<HTML>
<BODY BGCOLOR="#BOFFD8">
|
|
|
<SCRIPT LANGUAGE="JavaScript">
<!--
var bNewNumber = true;
function dec2hex(nDec)
{
var szHexTable="0123456789ABCDEF";
var szResult ="";
var szBuf="";
var nRem= 0;
var bNegative=false;
if(nDec < 0)
{
bNegative=true;
nDec = -nDec;
}
nTmp=nDec;
while(true)
{
nRem = nTmp % 16;
nTmp = nTmp / 16;
if(Math.floor(nTmp) < 16)
break;
szBuf=szHexTable.charAt(nRem);
szResult = szBuf.concat(szResult);
nTmp = Math.floor(nTmp);
}
szBuf=szHexTable.charAt(nRem);
szResult = szBuf.concat(szResult);
if(Math.floor(nTmp)!= 0)
{
szBuf=szHexTable.charAt(Math.floor(nTmp));
szResult = szBuf.concat(szResult);
}
if(bNegative == true)
return("-" + szResult);
e1se
return szResult;
}
function putNumber(bin, form)
{
var szOld = "";
var szNew = "";
if(bNewNumber)
{
parent.mainpage.document.forms[0].hexValue.value = "";
parent.mainpage.document.forms[0].decValue.value = "";
bNewNumber = false;
}
szOld = parent.mainpage.document.forms[0].decValue.value;
szNew = szOld.concat(btn.name);
nCurrent = eval(szNew);
parent.mainpage.document.forms[0].decValue.value = nCurrent;
}
function clearAll(form)
{
total = 0;
lastOperation = "+";
parent.mainpage.document.forms[0].hexValue.value = "0";
parent.mainpage.document.forms[0].decValue.value = "0";
bNewNumber = true;
}
function getResult(form)
{
parent. mainpage. document. forms[0]. hexValue. value = dec2hex(parent. mainpage. document. forms[0]. decValue. value);
bNewNumber = true;
}
//-->
</SCRIPT>
<FORM>
<TABLE BORDER=2 BORDERCOLOR="Black" BGCOLOR="Yellow">
<TR>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="5" VALUE=" 5 " onClick="putNumber(this, this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="6" VALUE=" б " onClick="putNumber(this, this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="7" VALUE=" 7 " onClick="putNumber (this, this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="8" VALUE=" 8 " onClick="putNunber (this, this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="9" VALUE=" 9 " onClick="putNumber (this, this.form);"></TD> </TR> <TR>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="0" VALUE=" 0 " onClick="putNumber(this,this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="1" VALUE=" 1 " onClick="putNumber (this, this.form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="2" VALUE=" 2 " onClick="putNumber (this, this. form);"></TD>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="3" VALUE=" 3 " onClick="putNumber (this, this.form);"></TD>
<TD ALIGN=CENTER><NPUT TYPE="button" NAME="4" VALUE=" 4 " onClick="putNumber (this, this.form);"></TD>
|
|
|
</TR>
<TR>
<TD ALIGN=CENTER><INPUT TYPE="button" NAME="C" VALUE=" С "
onClick="clearAll (this. form);"></TD>
<TD COLSPAN=4 ALIGN=CENTER><INPUT TYPE="button" NAME="=" VALUE=" to Hex " onClick="getResult (this.form);"></TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
Сценарії десятично-шестнадцатеричного перетворювача працює аналогічно сценарію шестнадцатеричного калькулятора (за винятком, звичайно, того, що перетворювач не виконує ніяких арифметичних дій). Головна відмінність полягає в тому, що тепер поля для запровадження і відображення чисел розташовуються в іншому документі HTML. завантаженому в окремий фрейм.
Для того щоб проинициализировать поля hexValue і decValue, ми посилаємося на форму, розташовану усередині фрейма mainpage:
parent. mainpage. document. forms[0]. hexValue. value = "";
parent. mainpage. document. forms[0]. decValue. value = "";
Тут parent посилається на об'єкт, що є батьківським стосовно документа HTML, що містить сценарії. У даному випадку це вікно, що містить усі наші фреймы.
Для читання вмісту поля decValue застосовується аналогічна техніка:
szOld = parent. mainpage. document. forms[0]. decValue. value;
Функція getResult, що виконує десятично-шестнадцатеричное перетворення, одержує вихідне число з нуля dccValue і передасть його функції dec2hex. Результат перетворення, виконаного цією функцією, записується потім у поле hexValue:
function getResult(form)
{
parent.mainpage.document.forms[0].hexValue.value = dec2hex(parent.mainpage.document.forms[0].decValue.value);
bNewNumber = true;
}
4.2.2. Відображення декількох документів HTML
У документі, що подає компакт-диск Фроловых, інформація відображається в трьох фреймах. Верхній фрейм використовується для заголовка, лівий - виконує роль змісту, і, нарешті, правий служить для показу вмісту. Натисканням кнопок, розташованих у лівому фрейме, можна переглядати в правій частині вікна різноманітні документи HTML.
У першому випуску компакт-диска не використовувалися сценарії JavaScript. Зараз покажемо, як можна за допомогою нескладного сценарію удосконалити інтерфейс користувача.
Будемо використовувати фрейм заголовка, розташований у верхній частині вікна, для розміщення анотації на матеріал, поданий у правому фрейме.
При цьому, якщо натиснути кнопку з написом "Ласкаво просимо", у заголовку з'явиться наш логотип, показаний на мал. 4.2. Якщо ж натиснути кнопки "Книги" або "Статті", заголовок будет виглядати так, як це показано відповідно на мал. 4.3 і 4.4.
|
|
|
B листинге 4.5 показаний вихідний текст файла опису фреймов.
|
|
|
|
|
Дата добавления: 2014-11-29; Просмотров: 318; Нарушение авторских прав?; Мы поможем в написании вашей работы!